requirejs的打包工具r.js
不建议用命令行,还是用配置文件比较方便--build.js。
我的build.js文件内容大概如下:
( {
appDir : './',
baseUrl : './scripts',
dir : './dist',
modules : [{
name : 'main'
}],
//忽略的文件--不用管目录结构,只需把需要忽略的文件名写出来就行
fileExclusionRegExp : /^(r|build)\.js|(test\.html)$/,
optimizeCss : 'standard',
removeCombined : true,
paths : {
jquery : 'jquery-1.10.1.min', config : 'config',
//其他的JS文件
otherjs : 'otherjs'
},
shim : {
otherjs : {
exports : 'otherjs',
deps : ['jquery']
}
}
})
注意事项:
1 这里面的paths和shim,其实和main.js中的几乎一样。
2 如果有在线引用的js文件,那可通过在其对应的值改为'empty:'就行。所以,第1点说的几乎一样,就是除了':empty'不一样之外,其他是一样的。
比如jquery.js是在线引用的,那就需要写成:jquery:'empty:'。
【但是,如果其他本地文件引用了jquery,那这时候就会出错了。解决方法就是把所依赖的jquery也放在本地。】
build.js文件写好之后,就可以开始用命令来打包了。
cd到当前目录,然后,输入:node r.js -o build.js 【r.js是依赖node的,[npm install requirejs],具体请查看:http://requirejs.org/docs/node.html】
最后,就会根据build.js配置文件来打包。
r.js的不好的地方就是打包js和css是分开的。
下面是打包css文件的方式。
1 在一个css文件【在上面已经打包好的dist目录下的css文件】的头部,通过@import的方式引入其他需要打包的css文件。比如在main.css文件的头部引入其他文件:
@import url('css/test1.css');
@import url('css/test2.css');
2 在命令行输入:node r.js -o cssIn=dist/styles/main.css out=dist/styles/main.min.css
这样就会把main.css文件以及@import进来的css文件都打包压缩好。
3 这时候,还需要手动把多余的文件或文件目录删掉
这样就大功告成了。
//==============================================//
build.js文件详情如下:
https://github.com/jrburke/r.js/edit/master/build/example.build.js
中文可参考:
http://www.cnblogs.com/didi/p/4146656.html
其他相关文章:
http://stackoverflow.com/questions/23978361/using-gulp-to-build-requirejs-project-gulp-requirejs
http://www.cnblogs.com/snandy/archive/2012/06/07/2537477.html
http://www.oschina.net/translate/optimize-requirejs-projects
最新文章
- Azure China (11) 使用Azure China Storage Public Blob
- thinkphp中field方法
- io 测试
- Ubuntu为已经安装的PHP7单独编译mysqli
- WIN7+wampserver2.4+zend stadio10.6.1配置Xdebug
- if与while相互嵌套,菱形*的实现.py
- django 开发笔记1
- 原生端与服务器通过sessionid实现session共享以及登录验证
- luogu3621 城池攻占 (倍增)
- python3实现二叉树的遍历与递归算法解析
- Android 开发 框架系列 OkHttp使用详解
- linux监控文件夹内的文件数量
- T-shirt 0 0....
- PAT 1005 继续(3n+1)猜想 (25)(代码)
- visual studio 修改注释快捷键,和断点
- android极光杀掉程序收不到通知
- CH0103 最短Hamilton路径 dp
- git reset --hard和git revert命令
- Python windows ping
- OA系统与Exchange 日历打通
热门文章
- Django之通过tag推荐文章
- HDFS源码分析数据块汇报之损坏数据块检测checkReplicaCorrupt()
- JVM完全指南
- C打印函数printf的一种实现原理简要分析
- 实现RTSP网站微信直播方案EasyNVR(linux版)部署问题之:ERR_CONTENT_LENGTH_MISMATCH
- sql中decode()重要函数使用
- AWS:5.公有云编程
- CALL FUNCTION 'BAPI_PO_CREATE1' 相关报错
- update module (更新模块)
- nodejs搭建简单的websocket服务端