Grunt PostCSS編譯非常慢

Question

出於好奇，我給了postCSS一個機會，但是我已經有大約2秒的編譯時間。

我只使用3個插件： autoprefixer ， postcss-import和postcss-nested

我有導入2個文件的app.css ：

@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任務：

        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文件？ 我想念什么嗎？

謝謝！

Answer 1

現在，PostCSS出現了這個問題，它太慢了。

在此文章中，筆者復制與PostCSS和不PostCSS工作流程。 最終結果使您認為PostCSS具有很大的潛力，但是您應該使用CSSNext版本更改工作任務。