RequireJS模块化后JS压缩合并
2013-06-01 16:30
344 查看
使用RequireJS模块化后代码被拆分成多个JS文件了,在部署生产环境需要压缩合并,RequireJS提供了一个打包压缩工具r.js来对模块进行合并压缩。r.js非常强大,不但可以压缩js,css,甚至可以对整个项目进行打包。
r.js的压缩工具使用UglifyJS或Closure Compiler。默认使用UglifyJS(jQuery也是使用它压缩)。此外r.js需要node.js环境,当然它也可以运行在Java环境中如Rhino。JAVA环境使用Ant构建可以参考另外一篇RequireJS optimizer Ant task有介绍。node环境参考RequireJS模块化与GruntJS构建。
本篇介绍require.js官方文档中介绍的方法。
build.xml
在node环境下执行 node r.js -o build.js 就可以压缩合并模块。
项目参考https://github.com/requirejs/example-multipage/blob/master/tools/build.js
r.js的压缩工具使用UglifyJS或Closure Compiler。默认使用UglifyJS(jQuery也是使用它压缩)。此外r.js需要node.js环境,当然它也可以运行在Java环境中如Rhino。JAVA环境使用Ant构建可以参考另外一篇RequireJS optimizer Ant task有介绍。node环境参考RequireJS模块化与GruntJS构建。
本篇介绍require.js官方文档中介绍的方法。
build.xml
{ appDir: '../www', baseUrl: 'js/lib', paths: { app: '../app' }, dir: '../www-built', modules: [ //First set up the common build layer. { //module names are relative to baseUrl name: '../common', //List common dependencies here. Only need to list //top level dependencies, "include" will find //nested dependencies. include: ['jquery', 'app/lib', 'app/controller/Base', 'app/model/Base' ] }, //Now set up a build layer for each page, but exclude //the common one. "exclude" will exclude nested //the nested, built dependencies from "common". Any //"exclude" that includes built modules should be //listed before the build layer that wants to exclude it. //"include" the appropriate "app/main*" module since by default //it will not get added to the build since it is loaded by a nested //require in the page*.js files. { //module names are relative to baseUrl/paths config name: '../page1', include: ['app/main1'], exclude: ['../common'] }, { //module names are relative to baseUrl name: '../page2', include: ['app/main2'], exclude: ['../common'] } ] }
在node环境下执行 node r.js -o build.js 就可以压缩合并模块。
项目参考https://github.com/requirejs/example-multipage/blob/master/tools/build.js
相关文章推荐
- requireJS中如何用r.js对js进行合并和压缩css文件
- 详解使用grunt完成requirejs的合并压缩和js文件的版本控制
- 使用grunt完成requirejs的合并压缩和js文件的版本控制
- gulpfile.js 合并压缩 requirejs 的配置文件
- 【转】JS模块化工具requirejs教程(一):初识requirejs
- 小心!AngularJS结合RequireJS做文件合并压缩的那些坑
- 开箱即用 - Grunt合并和压缩 js,css 文件
- Intellij IDEA下使用Ant构建工具压缩合并js和css
- [JS] JS模块化开发之RequireJS
- 折腾一两天,终于学会使用grunt压缩合并混淆JS脚本,小激动,特意记录一下+spm一点意外收获
- 前端速学成财:第八课-速玩JS文件合并和压缩
- 【web性能】 JS、CSS的合并、压缩、缓存管理
- Asp.net程序优化js、css实现合并与压缩的方法
- maven项目中整合grunt构建工具(二)-js合并、压缩技术
- 【转】JS模块化工具requirejs教程(二):基本知识
- 转:利用node压缩、合并js,css,图片
- 【前端】一句命令快速合并压缩 JS、CSS
- 高性能WEB开发 JS、CSS的合并、压缩、缓存管理
- grunt 合并压缩js和css文件(二)
- Ant和compiler合并压缩js