css - 试图将所有 scss 文件编译成一个 css 文件

Question

我有一个 grunt 文件，但我在编译它时遇到了问题。当我观看它时，它似乎运行良好但不生成任何文件。

我错过了什么？

module.exports = function(grunt) {
    grunt.initConfig({
        pngmin: {
            compile: {
                options: {
                    ext: '.png',
                    force: true,
                    speed: 3,
                    colors: 200
                },
                files: [{
                    expand: true, // required option
                    src: ['**/*.png'],
                    cwd: 'public/images/src/', // required option
                    dest: 'public/images/dist/'
                }]
            }
        },
        sass: {
            dist: {
                files: [
                    {
                        expand: true,
                        cwd: "public/sass",
                        src: ["**/*.sass"],
                        dest: "public/stylesheets",
                        ext: ".css"
                    }
                ]
            }
        },
        watch: {
            css: {
                files: '**/*.scss',
                tasks: ['sass']
            }
        }
    });


    grunt.loadNpmTasks('grunt-contrib-sass');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-pngmin');
    grunt.registerTask('default', ['pngmin', 'watch', 'sass']);

};

Answer 1

您正在查看 scss 文件，但您的 sass 任务中有 sass 文件。

假设您正在使用 sass 文件，您必须将代码更改为如下所示:

    sass: {
        dist: {
            files: [
                {
                    expand: true,
                    cwd: "public/sass",
                    src: ["**/*.sass"],
                    dest: "public/stylesheets",
                    ext: ".css"
                }
            ]
        }
    },
    watch: {
        css: {
            files: '**/*.sass',
            tasks: ['sass']
        }
    }

问候。