如何使用scss文件的多个子目录设置gruntjs指南针监视

Question

是否有一个gruntjs配置使用指南针监视与scss文件的多个子目录？我的文件夹结构如下:

scss/
  ie.scss
  modules/
    _mixins.scss
    _settings.scss
  partials/
    _forms.scss
    _grid.scss
    _typeography.scss
    _utilities.scss
  print.scss
  screen.scss
  vendor/
    _font-awesome.min.scss
    _pure-buttons.scss
    _pure-forms.scss

如果我在scss目录上设置了一个监视任务,它将监视该级别的三个文件.我想要一个类似于此项目在CodeKit中运行的设置,其中对正在导入的文件的任何更改screens.scss将触发刷新所有CSS代码.

因此,如果我改变某些内容,partials/_typeography.scss我需要grunt刷新screens.scss,其中包含@import该部分的声明.

Answer 1

看一下这个.

module.exports = function(grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        compass: {
            clean: {
                options: {
                    clean: true
                }
            },
            dev: {
                options: {
                    sassDir: ['sass'],
                    cssDir: ['css'],
                    environment: 'development',
                    force: true
                }
            },
            prod: {
                options: {
                    sassDir: ['sass'],
                    cssDir: ['css'],
                    environment: 'production',
                    force: true
                }
            }
        },
        watch: {
            sass: {
                files: ['sass/**/*.scss'],
                tasks: ['compass:dev']
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-compass');

    grunt.registerTask('build', ['compass:prod']);
    grunt.registerTask('default', ['watch']);
};