利用extract-text插件打包css出错

Question

webpack利用extract-text-webpack-plugin打包多页面项目的css时出现‘"extract-text-webpack-plugin" loader is used without the corresponding plugin’错误

module代码:

loaders: [
        {
            test: /\.css$/,
            loader:  ExtractTextPlugin.extract("style-loader","css-loader")
        }
    ]

plugins代码:

 /* 抽取出所有通用的部分 */
    new webpack.optimize.CommonsChunkPlugin({
        name: 'commons/commons',      // 需要注意的是，chunk的name不能相同！！！
        filename: '[name]/bundle.js',
        minChunks: 4
    }),
    /* 抽取出chunk的css */
    new ExtractTextPlugin('[name]/styles.css')

某个页面js代码

require('../../../css/style.css');
require('../../../css/index.css');
var common = require('../../lib/common.js');

webpack打包时总是出现

尝试不使用extract-text-webpack-plugin打包css,但最终通过HtmlWebpackPlugin生成的html会报window is undefined 错误

请问这是因为什么导致的

Answer 1

把style-loader干掉，这俩本来就是webpack引入css的两种方式，自然是互相冲突的：

loader:  ExtractTextPlugin.extract("css-loader")

Answer 2

找到问题了，extract-text-webpack-plugin没有出现问题，问题出现在使用htmlwebpackplugin时templatede的地址不正确，chunks也是文件地址不正确 = 。=