我见过很多与此相关的问题,但我没有找到理想的解决方案。
问题: 当我在我的项目中使用sass文件或js文件时,我想在更改时编译/ jshint这些文件。所以我使用 grunt-contrib-watch 来做到这一点。它工作正常,但在一些文件发生变化后,它正在跟踪文件更改,但它停止编译(停止运行任务,必须在文件更改时运行)。
代码:
module.exports = function (grunt) {
grunt.initConfig({
config: {
PROJECT_DIR: "Project"
},
sass: {
current: {
options: {
style: 'expanded',
lineNumber: true,
sourcemap: 'none',
update: true
}
}
},
jshint: {
all: []
},
watch: {
sass: {
files: ['<%= config.PROJECT_DIR %>**/sass/*.scss'],
tasks: ['sass:current'],
options: {
spawn: false,
debounceDelay: 2000
}
},
js: {
files: ['<%= config.PROJECT_DIR %>**/js/*.js'],
tasks: ['jshint'],
options: {
spawn: false,
debounceDelay: 2000
}
}
}
});
grunt.event.many('watch', 10, function (action, filepath, target) {
var paths = new cleanPaths(filepath);
var filepath = paths.filepath;
var dirpath = paths.dirpath;
switch (target) {
case 'sass':
if (grunt.file.isMatch(grunt.config('watch.sass.files'), filepath)) {
grunt.config('sass.current.src', filepath);
grunt.config('sass.current.dest', filepath.replace('sass/', 'css/').replace('.scss', '.css'));
// pushFile(filepath, filepath.replace('sass/', 'css/').replace('.scss', '.css'));
}
break;
case 'js':
if (grunt.file.isMatch(grunt.config('watch.js.files'), filepath)) {
grunt.config('jshint.all', [filepath]);
// pushFile(filepath)
}
break;
default:
break;
}
});
grunt.registerTask('default', ['watch']);
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-jshint');
};
我正在动态更新sass配置(src和dest值)。
的package.json
{
"name": "",
"version": "1.0.0",
"main": "Gruntfile.js",
"scripts": {},
"author": "",
"license": "",
"description": "",
"devDependencies": {
"grunt-contrib-jshint": "^1.0.0",
"grunt-contrib-sass": "^1.0.0",
"grunt-contrib-watch": "^1.0.0"
}
}
控制台图片链接:https://cloud.githubusercontent.com/assets/8776227/16587119/b7bfb332-42e6-11e6-8281-789ef60d22ec.png
即使在sass代码中没有错误,也停止编译。
我正在使用最新版本的grunt-contrib-watch插件。