0

我正在尝试在 gruntfile.js 的 cssmin 任务中设置两个目标(开发和构建)。这个答案消除了我在阅读npm 上的文档时的一些困惑,但我不能同时缩小和组合工作。为简化起见,我将只关注开发任务,因为构建将是一个简单的变体。

我试过这个:

cssmin: {
    dev: {
        options: {
            report: "min"
        },
        src: "<%= buildpath %>/css/customStep1.css",
        dest: "<%= buildpath %>/css/customStep2.css",
        combine: {
            files: {
                "<%= distpath %>/css/main.css": ["<%= buildpath %>/css/customStep2.css", "<%= buildpath %>/css/otherfile.css"]
            }
        }
    }
}

和这个:

cssmin: {
    dev: {
        options: {
            report: "min"
        },
        src: "<%= buildpath %>/css/customStep1.css",
        dest: "<%= buildpath %>/css/customStep2.css",
        files: {
            "<%= distpath %>/css/main.css": ["<%= buildpath %>/css/customStep2.css", "<%= buildpath %>/css/otherfile.css"]
        }
    }
}

两者都创建/缩小 customStep2.css,但组合部分也没有(即 main.css 没有被创建)。谢谢你的帮助。

4

2 回答 2

1

您的配置不起作用,因为您混合了几种不同的方式来指定文件。src-dest是一种方式,files是另一种方式。combine也不是 grunt 关键字,而只是任务的名称(或totoabcd相同)。

这是一个更简单的解决方案,但我不知道它是否符合您的需求:

cssmin: {
    dev: {
        options: {
            report: "min"
        },
        src: ["<%= buildpath %>/css/customStep1.css", "<%= buildpath %>/css/otherfile.css"],
        dest: "<%= distpath %>/css/main.css",
    }
}
于 2014-10-10T07:49:18.210 回答
1

我最终通过为组合部分创建一个单独的目标来解决这个问题(生产构建过程将 uncss - 此处未显示 - 添加到过程中,这太慢且在开发过程中没有必要):

cssmin: {
        dev: {
            options: {
                report: "min"
            },
            src: "<%= buildpath %>/css/customStep1.css",
            dest: "<%= buildpath %>/css/customStep3.css",
        },
        build: {
            options: {
                report: "gzip"
            },
            src: "<%= buildpath %>/css/customStep2.css",
            dest: "<%= buildpath %>/css/customStep3.css",
        },
        combine: {
            files: {
                "<%= distpath %>/css/main.css": ["<%= buildpath %>/css/customStep3.css", "<%= buildpath %>/css/otherfile.css"]
            }
        }
    }

然后像这样调用:

grunt.registerTask("devcss", ["less:dev", "cssmin:dev", "cssmin:combine", "cssmetrics:dev"]); // CSS build for dev
grunt.registerTask("buildcss", ["less:build", "uncss:build", "cssmin:build", "cssmin:combine", "cssmetrics:build"]); // Whole CSS build for deployment
于 2014-08-20T20:54:05.887 回答