seajs压缩合并
SeaJS在2.0之前，是采用SPM作为压缩合并工具的，到了2.0，改为Grunt.js，SPM变为包管理工具，类似NPM（不知道NPM？Google一下吧）
自动化不仅是科技带给社会的便利，也是Grunt带给前端的瑞士军刀。使用Grunt，可以很方便的定制各种任务，如压缩、合并等。使用Grunt之前，需要安装node环境和grunt工具，Google一下，十分钟后回来。
……
Grunt最核心的就两个部分，package.json、Gruntfile.js。
a. package.json
Grunt把一个项目/目录视为一个npm模块，package.json就是用来描述这个模块的信息，包括name、version、author等等。
这里强调一下，Grunt既然将该目录视为一个模块，那么该模块当然可以依赖其他模块。
我们看本示例的：
|
1
2
3
4
5
6
7
8
9
10
11
12
|
{
"name" : "HelloSeaJS",
"version" : "1.0.0",
"author" : "Qifeng Liu",
"devDependencies" : {
"grunt" : "0.4.1",
"grunt-cmd-transport" : "0.1.1",
"grunt-cmd-concat" : "0.1.0",
"grunt-contrib-uglify" : "0.2.0",
"grunt-contrib-clean" : "0.4.0"
}
}
|
devDependencies就是用来描述自身所依赖的模块
其中:
grunt模块用来跑Gruntfile.js中定义的任务
grunt-cmd-transport模块用来对SeaJS定义的模块进行依赖提取等任务
grunt-cmd-concat模块用来对文件进行合并
grunt-contrib-uglify模块用来压缩JavaScript
grunt-contrib-clean模块用来清除临时目录
b. Gruntfile.js
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
module.exports = function(grunt){
grunt.initConfig({
transport : {
options : {
format : 'application/dist/{{filename}}' //生成的id的格式
},
application : {
files : {
'.build' : ['application.js','util.js'] //将application.js、util.js合并且提取依赖，生成id，之后放在.build目录下
}
}
},
concat : {
main : {
options : {
relative : true
},
files : {
'dist/application.js' : ['.build/application.js'], // 合并.build/application.js文件到dist/application.js中
'dist/application-debug.js' : ['.build/application-debug.js']
}
}
},
uglify : {
main : {
files : {
'dist/application.js' : ['dist/application.js'] //对dist/application.js进行压缩，之后存入dist/application.js文件
}
}
},
clean : {
build : ['.build'] //清除.build文件
}
});
grunt.loadNpmTasks('grunt-cmd-transport');
grunt.loadNpmTasks('grunt-cmd-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.registerTask('build',['transport','concat','uglify','clean'])
};
|
定义好两个文件之后，就可以进入到application目录下，首先运行：
npm install
该命令会下载好package.json中依赖的模块
然后运行
grunt build
该命令会运行grunt.registerTask方法中指定的任务
不出差错的话，会在application目录下生成一个dist目录，里面包含了合并但没压缩的application-debug.js和合并且压缩好的application.js。
修改index.html的
<script src="assets/scripts/seajs/sea.js" id="seajsnode" data-main="application/application"></script>
为
<script src="assets/scripts/seajs/sea.js" id="seajsnode" data-main="application/dist/application"></script>
大功告成！
http://www.k68.org/?p=1232
http://tgideas.qq.com/webplat/info/news_version3/804/808/811/m579/201307/216460.shtml