css预编译 sass + autoprefixer

脚手架：https://github.com/zhuweileo/autoprofixer-temp

1. webpack配置文件

var webpack = require('webpack')
var path = require('path')
var ExtractTextPlugin = require('extract-text-webpack-plugin')
var autoprefixer = require('autoprefixer')
module.exports = {
    entry: path.join(__dirname, "js/index.js"),
    output: {
        path: path.join(__dirname, "../public"),
        filename: "js/index.js"
    },
    module: {
        rules: [{
            test: /\.scss$/,
            use: ExtractTextPlugin.extract({
                fallback: "style-loader",
                use: ["css-loader", "sass-loader", "postcss-loader"]
                // use: ["css-loader", "sass-loader" ]
            }) //把 css 抽离出来生成一个文件
        }],
    },  
    plugins: [
        new ExtractTextPlugin("css/index.css")
    ]
};

2. 需要按照的模块：

"devDependencies": {
    "autoprefixer": "^7.1.1",
    "css-loader": "^0.28.4",
    "extract-text-webpack-plugin": "^2.1.2",
    "node-sass": "^4.5.3",
    "postcss-loader": "^2.0.5",
    "sass-loader": "^6.0.5",
    "style-loader": "^0.18.2",
    "webpack": "^2.6.1"
  }

3. 使用postcss 的autoprefixer需要在 需要scss文件所在的文件夹内 放一个postcss.config.js文件
   文件内容如下：

module.exports = {
  plugins: [
    require('autoprefixer')
  ]
}