webpack2 css分离没有成功。

Question

不知道哪写的不正确。

const Ex = require('extract-text-webpack-plugin');

{
    test: /\.css$/,
    use: Ex.extract(["vue-style-loader", "css-loader"])
},
{
    test: /\.less$/,
    use: Ex.extract(["vue-style-loader", "css-loader", "less-loader"])
},
{
    test: /\.(scss|sass)$/,
    use: Ex.extract(["node-sass", "vue-style-loader", "css-loader", "sass-loader"])
},

new Ex('[name].css')

less sass 引入

<!--引入less 文件-->
<style src="./style/index.less" lang="less"></style>
<!--引入scss 文件-->
<style src="./style/scss.scss" lang="sass"></style>
<!--引入sass 文件-->
<style src="./style/sass.sass" lang="sass"></style>

打包后的页面把less sass 全解析成

<style>
xxxxxx
</style>

并没有给我分离出来！不知道哪儿弄的不对！

Answer 1

应该是vue-style-loader的锅吧，这货跟style-loader差不多，就是把css用<style>插入dom的。

你可以试试把vue-style-loader干掉

Answer 2

请看下webpack2.0中extract-text-webpack-plugin的配置语法