2016-05-07 61 views
0

我给postCSS一个纯粹的好奇心,但我的编译时间已经达到约2秒。Grunt PostCSS编译非常慢

我只使用3个插件:autoprefixerpostcss-importpostcss-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文件?我错过了什么吗?

谢谢!

回答

1

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

this文章,作者使用PostCSS和PostCSS复制工作流。最终的结果让你了解PostCSS有很多潜力,但你应该用CSSNext版本来改变你的工作任务。

问候。