进阶的前面两篇讲述了r.js如何经过命令行把全部的模块压缩为一个js文件或把全部的css压缩为一个css文件。其中包括一些压缩配置参数的使用。css
但以上两种方式有几个问题html
一、经过命令手动配置压缩选项显得很呆板
二、都仅合并为一个文件前端
对于最后只生成一个文件的库来讲,这种方式并没有不妥。好比jQuery,它的工程中小文件有20多个,打包后只有一个jquery-1.x.x.js。对于多数实际应用项目来讲,可能打包后须要生成多个js文件。有些是页面打开时就要用到的,有些是用户点击或输入时按需加载的。jquery
r.js有另一种方式来合并压缩,即经过一个配置文件(如build.js)。配置文件内部采用前端工程师很是熟悉JSON格式。这样当项目开发目录固定后,配置文件也相应固定。经过配置文件就很好的隔离了开发环境及上线环境。前端工程师
此次咱们建立的目录中包含全部前端资源,js,css,图片。app
其中有两个页面page1.html,page2.html。这两个页面分别使用page1.js和page2.js。ui
page1.js依赖于event和selector,page2.js依赖于event、selector和jQuery。jQuery是非本地的,没有合并前咱们直接访问这两个页面,那么单个的js文件会依次下载。spa
如今使用r.js来合并压缩,使每一个页面除下载require.js外只下载各自合并的大文件page1.js和page2.js。命令行
build.js以下code
({ appDir: "./", baseUrl: "js", dir: "../r6-built", paths: { jquery: 'empty:' }, modules: [ { name: "page1" }, { name: "page2" } ] })