Question

我的watch命令执行除sass之外的所有任务。当我执行grunt sass时，收到以下消息错误：

警告：你需要安装ruby和sass并在你的路径中才能完成这项任务。

我不知道为什么会显示此消息，因为我可以通过Ruby控制台从.scss生成我的.css文件（sass --watch styles / scss / general.scss：styles / css / general。 css），所以我安装了Ruby和sass。

我的Gruntfile.js如下：

module.exports = function(grunt) {

// 1. All configuration goes here 
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    concat: {   
        dist: {
            src: [
                'js/libs/*.js', // All JS in the libs folder
            ],
            dest: 'js/build/production.js',
        }
    },

    uglify: {
        build: {
            src: 'js/build/production.js',
            dest: 'js/build/production.min.js'
        }
    },

    imagemin: {
        dynamic: {
            files: [{
                expand: true,
                cwd: 'images/',
                src: ['**/*.{png,jpg,gif}'],
                dest: 'images/optimized/'
            }]
        }
    },

    sass: {
        dist: {
            options: {
                style: 'compressed'
            },
            files: {
                'styles/css/general.css': 'styles/scss/general.scss'
            }
        } 
    },

    watch: {
        scripts: {
            files: ['**/*.{png,jpg,gif}', 'js/libs/*.js'],
            tasks: ['imagemin', 'concat', 'uglify'],
            options: {
                spawn: false,
            }
        },
        sass: {
            files: ['css/*.scss'],
            tasks: ['sass']
        }
    }

});

// 3. Where we tell Grunt we plan to use this plug-in.
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-compass');

// 4. Where we tell Grunt what to do when we type "grunt" into the terminal.
grunt.registerTask('default', ['concat', 'uglify', 'imagemin', 'watch', 'sass']);

};

我的操作系统是Windows7。有什么想法吗？

Answer 1

尝试

var config = {
    app: 'app',
    dist: 'dist'
};

grunt.initConfig({
 sass: {
        dist: {
          options: {
            style: 'compressed'
          },
          files: [{
            cwd: 'styles/scss/',
            src: '*.scss',
            dest: 'styles/css/',
            ext: '.css'
          }],
      },

 watch: { 
   sass: {
            files: ['styles/scss/{,*/}*.scss'],
            tasks: ['sass'],
            options: {
                livereload: true
            }
        }
 }
};

最好将所有grunt.loadNpmTasks放在grunt.initConfig之前的顶部

Grunt没有执行sass命令

1 个答案: