webpack autoprefixer 对import和require的css文件没有生效

Question

使用vue-cli构建的开发环境，autoprefixer没有处理import 和 require 的css文件，
vue文件中写的没有问题，请问怎么处理？

Answer 1

在vue文件中@import的方式引入css文件：

安装postcss-import

var postcssImport = require('postcss-import')
...
vue: {
    loaders: utils.cssLoaders({ sourceMap: useCssSourceMap }),
    // postcss: [
    //   require('autoprefixer')({
    //     browsers: ['last 2 versions', 'ios >= 7.0']
    //   })
    // ]
    postcss: function(webpack) {
      return [
        postcssImport({
          addDependencyTo: webpack
        }),
        require('autoprefixer')({
          browsers: ['ios >= 7.0']
        })
      ]
    }
  }

js文件中require方式引入css文件暂时没有找到合适的方法，
但是发现了一个bug，就是使用require引入css文件时不能使用css-loader

Answer 2

看下这个项目的webpackconfig
https://github.com/shenxiang1...

Answer 3

如图,增加一个postLoader,然后配置到 generateLoaders 中的loaders变量里

可以加qq: 910--520--913