Sass 带咕噜的指南针插件
这是一个关于如何在咕噜声中使用指南针的问题。 数据填充步骤出错。我在控制台上注意到,当我只修改一个.scss文件时,compass会将同一个文件填充四次、五次或最多十次。 在你看来,这取决于什么?这是我的Grunfile.js。 谢谢你的帮助Sass 带咕噜的指南针插件,sass,gruntjs,compass-sass,grunt-contrib-compass,Sass,Gruntjs,Compass Sass,Grunt Contrib Compass,这是一个关于如何在咕噜声中使用指南针的问题。 数据填充步骤出错。我在控制台上注意到,当我只修改一个.scss文件时,compass会将同一个文件填充四次、五次或最多十次。 在你看来,这取决于什么?这是我的Grunfile.js。 谢谢你的帮助 module.exports = function (grunt) { var _homeJs = ['contents/js/jquery.Cinema.js', 'contents/js/jquery.SkinOverlay.js']; var _h
module.exports = function (grunt) {
var _homeJs = ['contents/js/jquery.Cinema.js', 'contents/js/jquery.SkinOverlay.js'];
var _homeJsExclude = []
_homeJs.forEach(function (entry) {
_homeJsExclude.push('!' + entry)
});
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
dist: {
src: ['contents/js/*.js', _homeJsExclude],
dest: 'contents/dist/js/global.js'
},
lib: {
src: 'contents/plugins/**/*.js',
dest: 'contents/dist/js/libs.js'
},
globalhome: {
files: {
'contents/dist/js/global.home.js': _homeJs
}
}
},
uglify: {
dist: {
src: ['<%= concat.dist.dest %>'],
dest: 'contents/dist/js/global.min.js'
},
globalhome_min: {
src: 'contents/dist/js/global.home.js',
dest: 'contents/dist/js/global.home.min.js'
},
lib: {
src: ['<%= concat.lib.dest %>'],
dest: 'contents/dist/js/libs.min.js'
}
},
compass: {
dist: {
options: {
sassDir: 'contents/sass/',
cssDir: 'contents/dist/css',
watch: true,
outputStyle: 'compressed',
linecomments: false
}
}
},
cssmin: {
target: {
files: [
{
'./contents/dist/css/ie-css/ie8/ie8.min.css': ['./contents/css/ie-css/ie8/ie8.css']
},
{
'./contents/dist/css/main.min.css': ['./contents/dist/css/main.css']
},
{
'./contents/dist/css/responsive.min.css': ['./contents/dist/css/responsive.css']
}
]
}
},
concurrent: {
target: {
tasks: ['compass', 'watch'],
options: {
logConcurrentOutput: true
}
}
},
watch: {
js: {
files: ['contents/js/*.js', 'contents/plugins/**/*.js'],
tasks: ['concat', 'uglify:dist', 'uglify:globalhome_min'],
options: {
reload: true
}
},
css: {
files: ['contents/sass/**/*.scss', 'contents/dist/css/'],
tasks: ['concurrent:target'],
options: {
reload: true
}
}
},
});
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-concurrent');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.registerTask('default', ['concat', 'uglify', 'cssmin']);
}) 这里有几个问题。。。首先,您已经在compass任务中监视sass文件,不需要使用显式监视任务来监视它们。此外,您的并发任务设置为在sass文件更改后再次运行watch 这是您现在设置的逻辑流: 启动watch,它等待sass或编译的css文件更改 当sass文件更改时,watch执行concurrent,concurrent依次执行compass,然后执行watch的另一个实例。 compass任务编译css,从而使watch任务检测到更改并再次运行并发任务。 这种情况持续下去,破坏了一切。 因此,与其使用现在的配置,不如使用以下简化配置:
grunt.initConfig({
// ...
compass: {
dist: {
options: {
sassDir: 'contents/sass/',
cssDir: 'contents/dist/css',
// *** remove this option
// watch: true,
outputStyle: 'compressed',
linecomments: false
}
}
},
// ...
// *** remove this whole task, in the current config you do not need it
/*
concurrent: {
target: {
tasks: ['compass', 'watch'],
options: {
logConcurrentOutput: true
}
}
},
*/
watch: {
// ...
css: {
// *** only watch the source files, not the output
files: ['contents/sass/**/*.scss'],
// *** run the `compass` task directly
tasks: ['compass'],
options: {
reload: true
}
}
}
});
您可以通过以下方式启动整个过程:
~/my-project$ grunt watch
或者,如果要先运行compass,请注意更改:
~/my-project$ grunt compass watch
我注意到一点,编译文件css知道grunt有点慢,你能告诉我为什么吗?谢谢。我不确定你到底在问什么,但如果是关于指南针慢的问题,是的。我没有任何解决办法