Javascript Grunt罗盘开发和生产

Javascript Grunt罗盘开发和生产,javascript,css,gruntjs,compass-sass,compass,Javascript,Css,Gruntjs,Compass Sass,Compass,我对GruntJS+SASS Compass有问题。我已经设置了dev和prod配置。 对于devcss有outputStyle:“expanded”,对于prod有outputStyle:“compressed”。当我做prod时,它就像一个符咒。在控制台里我看到了 Running "compass:dist" (compass) task overwrite css/screen.css (0.392s) Compilation took 0.4s css被压缩得恰如其分 但当我在做dev

我对GruntJS+SASS Compass有问题。我已经设置了
dev
prod
配置。 对于
dev
css有
outputStyle:“expanded”
,对于
prod
outputStyle:“compressed”
。当我做
prod
时,它就像一个符咒。在控制台里我看到了

Running "compass:dist" (compass) task
overwrite css/screen.css (0.392s)
Compilation took 0.4s
css被压缩得恰如其分

但当我在做
dev
时,它在控制台中什么也不显示

Running "compass:dev" (compass) task

Running "autoprefixer:dist" (autoprefixer) task
css仍然是压缩的

这是我的Grunfile.js配置:

module.exports = function(grunt) {
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    compass: {
        dev: {
            options: {
                sassDir: 'sass',
                cssDir: 'css',
                imagesDir: 'images',
                fontsDir: 'fonts',
                relativeAssets: true,
                boring: true,
                outputStyle: 'expanded',
                environment: 'development',
                raw: 'preferred_syntax = :sass\n'
            }
        },
        dist: {
            options: {
                sassDir: 'sass',
                cssDir: 'css',
                imagesDir: 'images',
                fontsDir: 'fonts',
                relativeAssets: true,
                boring: true,
                force: true,
                bundleExec: true,
                outputStyle: 'compressed',
                environment: 'production',
                raw: 'preferred_syntax = :sass\n'
            }
        }
    },

    autoprefixer: {
        dist:{
            files:{
                'css/screen.css':'css/screen.css'
            }
        }
    },

    concat: {
        dist: {
            src: [
                'js/vendors/filename.js',
                'js/companyname/filename.js'
            ],
            dest: 'js/companyname/main.js'
        }
    },

    jshint: {
        all: ['Gruntfile.js'],
        beforeconcat: [
            'js/src/companyname/app.js',
            'js/src/companyname/bar.js'
        ]
    },

    uglify: {
        options: {
            mangle: false
        },
        prod: {
            files: [{
                expand: true,
                cwd: 'js',
                src: [
                    'vendors/**/*.js',
                    'companyname/**/*.js'
                ],
                dest: 'js'
            }]
        }
    },

    copy: {
        main: {
            expand: true,
            cwd: 'js/src',
            src: [
                'companyname/**/*.js',
                'vendors/**/*.js'
            ],
            dest: 'js/'
        }
    },

    imagemin: {
        jpg: {
            options: {
                optimizationLevel: 8
            },
            files: [
                {
                    expand: true,
                    cwd: 'images-src/',
                    src: ['**/*.jpg'],
                    dest: 'images/',
                    ext: '.jpg'
                }
            ]
        },
        png: {
            options: {
                optimizationLevel: 8
            },
            files: [
                {
                    expand: true,
                    cwd: 'images-src/',
                    src: ['**/*.png'],
                    dest: 'images/',
                    ext: '.png'
                }
            ]
        }
    },

    clean: {
        images: {
            src: ['images']
        }
    },

    watch: {
        compass: {
            files: [
                'sass/{,*/}*.sass',
                'images-src/{,*/}*.{png,jpg,gif}'
            ],
            tasks: [
                'compass:dev',
                'autoprefixer',
                'clean:images',
                'imagemin'
            ]
        }
    }
});

grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-autoprefixer');
grunt.loadNpmTasks('grunt-contrib-watch');

grunt.registerTask('default', [
    'compass:dev',
    'autoprefixer',
    'copy',
    'concat',
    'jshint',
    'uglify'
]);

grunt.registerTask('prod', [
    'compass:dist',
    'autoprefixer',
    'copy',
    'concat',
    'jshint',
    'uglify',
    'clean:images',
    'imagemin'
]);
};

我做错了什么

您可以制作两个不同的指南针

compass: {
   dev: {
     ...
     force: true
     ...
   },
   devWatch: {
   ... ur original ... 
   }
}

watch(compass: {tasks: ['compass:devWatch', ...]})

grunt.registerTask('watch', [
   'compass:dev',
   'watch'
]);

grunt.registerTask('dev', [
   'compass:dev'
]);

谢谢!你的回答帮助我找到了一个bug。我忘了为dev任务添加
force:true
。其余的都是像魔咒一样的作品。