Grunt是node在windows平台的项目构建工具,其作用相当于Makefile。
Grunt的详细介绍请阅读Grunt中文网的说明:http://gruntjs.cn/getting-started/ ,一定要看。。。。
Grunt的核心插件都是以grunt-contrib开头的,grunt-mocha-test,grunt-blanket都是第三方的,他们两个其实就是mocha和blanket,只不过现在是Grunt的插件形式。
用package.json,gruntfile.js文件来说明比较简单点:
package.json中:
"devDependencies": {
"grunt": "*", //这个没啥好说的
"grunt-mocha-test": "*", //同上
"grunt-blanket": "*", //覆盖率测试的插件
"grunt-contrib-clean": "*", //清除文件、文件夹的插件
"grunt-contrib-copy": "*", //复制文件、文件夹的插件
"travis-cov": "*", //覆盖率测试成功的临界值设置插件,低于临界值则显示覆盖率测试失败
"grunt-contrib-jshint": "*", //这个没啥好说的
"grunt-contrib-uglify": "*", //这个没啥好说的
"grunt-contrib-watch": "*", //监视文件改动的插件
"should": "*" //这个不管他
}
记得npm install
Gruntfile.json中:
//grunt的配置文件Gruntfile.js,它的作用就是管理、配置各式各样的grunt插件,使插件们可以自动化运行。
//在webstorm里面可以直接打开grunt的管理窗口
module.exports = function(grunt) {
//下面的模块既是npm的模块,也是grunt的插件。使用npm install后,即可在这里加载。
//grunt-mocha-test和mocha并没有什么不同,只是前者在后者基础上做了封装使其成为grunt插件
//grunt-blanket和blanket同理
grunt.loadNpmTasks('grunt-mocha-test');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-blanket');
grunt.loadNpmTasks('grunt-contrib-watch');
//加载了的插件,在grunt.initconfiguration中一一配置,配置后的"任务"即可在Grunt运行。
//如果不是grunt插件,那这些配置是需要写在package.json里面的。
grunt.initConfig({
//任务clean:删除src中的文件夹。
clean: {
coverage: {
src: ['coverage/'] //删除coverage/目录
}
},
//copy任务:将测试文件(是test.js之类的,不是被测试文件)复制到新的文件夹下
copy: {
coverage: {
src: ['test/*.js'], //将test目录以及目录下所有.js文件复制到coverage目录下
dest: 'coverage/'
}
},
//blanket任务:像jscover一样将被测试文件编译成_$jscoverage['lib/somelib.js'][4]=0;这样的东西
blanket: {
coverage: {
src: ['lib/'], //将lib目录以及其下的所有文件编译后,放在'coverage/lib/'目录下
dest: 'coverage/lib/'
}
},
//mochaTest任务:这里包括了本身的test、 使用了blanket的覆盖率报告、还有与blanet一起使用的travis-cov(设置覆盖率测试警戒临界值)
mochaTest: {
//子任务test:执行mocha coverage/test/*.js -R spec
test: {
options: {
reporter: 'spec', //html-cov
//当watch的spawn设置为false时,再次修改测试代码就会失效,所以这里清下require缓存。
clearRequireCache: true
},
//执行哪里的测试文件
src: ['coverage/test/*.js']
},
//子任务coverage:执行覆盖率测试,格式'html-cov',输出到coverage.htm文件
coverage: {
options: {
reporter: 'html-cov',
quiet: true, //???
captureFile: 'coverage.html'
},
src: ['coverage/test/*.js']
},
'travis-cov': {
options: {
reporter: 'travis-cov'
},
src: ['coverage/test/*.js']
}
},
//watch任务:
watch: {
js: {
options: {
spawn: false
},
files: 'test/*.js',
tasks: ['default']
}
}
});
//当watch检测到改动,并触发了grunt事件,那么检查改动的是哪个文件,
// //测试用例不是特别的就不用这个了
var defaultTestSrc = grunt.config('mochaTest.test.src');
grunt.event.on('watch', function(action, filepath) {
grunt.config('mochaTest.test.src', defaultTestSrc);
if (filepath.match('test/')) {
grunt.config('mochaTest.test.src', filepath);
}
});
//上面配置后的插件其实已经可以单独运行,这里配置的default将几个任务按顺序运行,形成初步的自动化。
//和上面单独的插件配置任务一样,这个grunt default命令已经可以在cmd窗口执行并输入结果。
grunt.registerTask('default', ['clean', 'blanket', 'copy', 'mochaTest','default']);
};