webpack + vue之抽离style样式css方法

大部分使用过webpack的朋友都知道，抽离css需要使用到webpack的插件extract-text-webpack-plugin，vue也不例外。官方给的vue-loader的文档里面有这样的描述

不要在style上添加scss或者less，否则你要去配置他们的抽离

我们现在抽离.vue文件下的style的css样式，zmz在测试了很多得出以下不是结论的结论，由于第一次玩没有别人指点走了不少弯路，现在总结如下，

抽离普通css样式，（适合style默认lang）

module: {
rules: [
    {     //处理js中引入的css
        test: /\.css$/,
        loader: ExtractTextPlugin.extract({
            use: [
                {
                    loader: 'css-loader'
                }
            ]
        })
    },
    {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {loaders:{
            css: ExtractTextPlugin.extract({
                use: 'css-loader',
                fallback: 'vue-style-loader'
            })
        }}
    }
 ]
 },
 plugins: [ //这个不添加allChunks参数的话，不会抽离chunk的css
    new ExtractTextPlugin({filename: 'css/[name].[hash:5].css', allChunks: true})
  ]