我的grunt.js有一个典型的缩小任务:
min: {
dist: {
src: ['dist/precook.js'],
dest: 'dist/precook.min.js'
}
}
拥有多个目标文件的最简单方法是什么?我想缩小成:
built-in min task似乎不支持多个目的地,因此我认为这可以通过简单的“复制”任务来实现。有人可以指出我正确的方向吗?
答案 0 :(得分:9)
我使用grunt-contrib-copy插件:
使用npm安装:
npm install grunt-contrib-copy
修改grunt.js
(添加复制任务定义和加载复制插件):
...
copy: {
dist: {
files: {
'example/js/vendor/': 'dist/precook.min.js'
}
}
}
...
grunt.loadNpmTasks('grunt-contrib-copy');
可选register copy
in to grunt's default task。
这里增加的美妙之处在于您现在也可以执行所有其他复制任务。甚至支持模式,例如复制所有缩小的文件('dist/*.min.js'
)。
答案 1 :(得分:6)
concat: {
css: {
src: ['UI.controls/assets/css/*.css'],
dest: 'UI.controls/assets/css/min/production.css'
},
js: {
src: ['UI.controls/assets/js/*.js'],
dest: 'UI.controls/assets/js/min/production.js'
},
js2: {
src: ['UI.core/assets/js/*.js'],
dest: 'UI.core/assets/js/min/production.js'
}
},
cssmin: {
css: {
src: 'UI.controls/assets/css/min/production.css',
dest: 'UI.controls/assets/css/min/production.min.css'
}
},
uglify: {
js: {
src: 'UI.controls/assets/js/min/production.js',
dest: 'UI.controls/assets/js/min/production.min.js'
},
js2: {
src: 'UI.core/assets/js/min/production.js',
dest: 'UI.core/assets/js/min/production.min.js'
}
},
watch: {
css: {
files: ['UI.controls/assets/css/*.css'],
tasks: ['concat:css', 'cssmin:css']
},
js: {
files: ['UI.controls/assets/js/*.js'],
tasks: ['concat:js', 'uglify:js']
},
js2: {
files: ['UI.core/assets/js/*.js'],
tasks: ['concat:js', 'uglify:js']
}
}
答案 2 :(得分:1)
这是一种替代方法(在 @jalonen 的解决方案旁边),如果您使用requirejs模块化您的项目,那么您可能会感兴趣,然后您可以使用requirejs optimizer缩小模块。
首先,您需要在项目中添加grunt-contrib-requirejs:
npm install grunt-contrib-requirejs --save-dev
Grunt配置:
requirejs: {
production:{
options:{
// don't include libaries when concatenating/minifying
paths:{
angular:'empty:',
jquery:'empty:'
},
baseUrl:'path/to/src/js',
dir:'path/to/target/js',
// keeps only the combined files
removeCombined:true,
modules:[
{name:'app', exclude: ['moduleA', 'moduleB']},
{name:'moduleA'},
{name:'moduleB'}
]
}
}
}
...
grunt.loadNpmTasks('grunt-contrib-copy');
<强>解释强>
我们假设你有这个依赖树(->
意味着取决于):
app -> moduleA -> moduleA1
-> moduleA2
app -> moduleB -> moduleB1
-> moduleB2
缩小后,您将有三个文件:
app
(应用的缩小版)moduleA
(缩小版moduleA
,moduleA1
和moduleA2
)moduleB
(缩小版moduleB
,moduleB1
和moduleB2
)答案 3 :(得分:1)
遇到类似的问题并创建了一个grunt multi-task来运行多个目录上的指定任务列表
确切案例的用法: ```
min: {
dist: {
src: ['dist/precook.js'],
dest: 'dist/precook.min.js'
}
},
multidest: {
minifiedFiles: {
tasks: ['min'],
dest: [
'dist/precook.min.js',
'example/js/vendor/precook.min.js'
]
}
}
```