0

我纯粹出于好奇而尝试了 postCSS，但我已经有大约 2 秒的编译时间了。

我只使用 3 个插件autoprefixer:postcss-import和postcss-nested

我已经app.css导入了 2 个文件：

@import "_base/_base.css";

@import "_common/_common.css";

然后我有_base.css：

.title {
    display: flex;
    color: white;
}

和_common.css：

header {
    background: red;

    h1 {
        background: black;
    }
}

我的观察者只在看/postCSS：

    ...
    watch: {
        postcss: {
            files: grunt.settings.devDir + 'postCSS/{,**/}*.css',
            tasks: ['postcss:dev']
        }
    },
    ...

postcss：开发任务：

        dev: {
            options: {
                map: false,
                processors: [
                    require('autoprefixer')({browsers: 'last 1 versions'}),
                    require('postcss-import')(),
                    require('postcss-nested')()
                ]
            },
            files: [{
                expand: true,
                cwd: grunt.settings.devDir + 'postCSS/',
                src: ['app.css'],
                dest: grunt.settings.devDir + 'css/'
            }]
        },

所以我的问题是，我怎样才能有 2 秒的时间来编译 3 个小 css 文件？我错过了什么吗？

谢谢！

4

1 回答 1

1

现在，PostCSS 有这个问题，它太慢了。

在本文中，作者复制了使用 PostCSS 和不使用 PostCSS 的工作流程。最终结果告诉你 PostCSS 有很大的潜力，但是你应该用 CSSNext 版本改变你的工作任务。

于 2016-05-08T08:23:10.707 回答