怎么用 RequireJS 把前端代码打成多个包

JavaScript019

怎么用 RequireJS 把前端代码打成多个包,第1张

举例说一下吧:

比如,我有两个页面,分别调用了main.js和add.js....在这两个里面会自动查找到关联的js模块,所以只在html页面里面写上这两个的入口,如下:

index.html页面里面:<script src="js/require.js" defer async="true" data-main="js/main"></script>

add.html页面里面:<script src="js/require.js" defer async="true" data-main="js/main"></script>

那么单独写一个配置文件,简单如下:

({

appDir: "./",

baseUrl: "js",

dir: "../r-build",

paths: {

jquery: 'empty:'

},

modules: [

{

name: "main"

},

{

name: "add"

}

]

})

appDir: 应用程序的最顶层目录。可选的,如果设置了的话,r.js会认为脚本在这个路径的子目录中,应用程序的文件都会被拷贝到输出目录(dir 定义的路径)。如果不设置,则使用下面的 baseUrl 路径。

baseUrl: 默认情况下,所有的模块都是相对于这个路径的。如果没有设置,则模块的加载是相对于 build 文件所在的目录。另外,如果设置了appDir,那么 baseUrl 应该定义为相对于 appDir 的路径。

dir: 输出目录的路径。如果不设置,则默认为和 build 文件同级的 build 目录。

modules: 定义要被优化的模块数组。每一项是模块优化的配置,常用的几个参数如下:

通过上面的配置,index.html就会引用main.js的打包文件,而add.html就会引用add.js打包文件,它们只引用自己需要的,而不是全部打包。

没有必要非要掌握哪一个框架,个人认为前端工程师最主要也是最重要的把JS学好,学透就可以了~别的框架什么的现用现学都来得及!几个常用的比如JQ啦require啦等等这些是你做项目的时候经常用的,不用要求你也应该会了~其实所有的东西都是在JS的基础上起来的,会了JS就都好说了~