使用extract-text-webpack-plugin对css单独打包报错

使用extract-text-webpack-plugin对css单独打包报错_第1张图片
最后webpack打包,报以下错误:

ERROR in ./src/page/index/index.css
Module build failed: ReferenceError: window is not defined
    at D:\MyProject\project\mmall\doc\mmall-fe\node_modules\style-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\node_modules\css-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\src\page\index\index.css:193:4
    at D:\MyProject\project\mmall\doc\mmall-fe\node_modules\style-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\node_modules\css-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\src\page\index\index.css:183:48
    at module.exports.module.exports (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\style-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\node_modules\css-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\src\page\index\ind
ex.css:221:69)
    at Object. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\style-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\node_modules\css-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\src\page\index\index.css:59:3
7)
    at __webpack_require__ (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\style-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\node_modules\css-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\src\page\index\index.css:21:
30)
    at D:\MyProject\project\mmall\doc\mmall-fe\node_modules\style-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\node_modules\css-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\src\page\index\index.css:41:18
    at Object. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\style-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\node_modules\css-loader\index.js!D:\MyProject\project\mmall\doc\mmall-fe\src\page\index\index.css:44:1
0)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Object.exec (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack-core\lib\NormalModuleMixin.js:88:7)
    at Object. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\extract-text-webpack-plugin\loader.js:97:22)
    at Compiler. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compiler.js:214:10)
    at D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compiler.js:403:12
    at Compiler.next (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:67:11)
    at Compiler. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\extract-text-webpack-plugin\loader.js:78:5)
    at Compiler.next (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:69:14)
    at Compiler. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\CachePlugin.js:40:4)
    at Compiler.applyPluginsAsync (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:71:13)
    at Compiler. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compiler.js:400:9)
    at Compilation. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compilation.js:577:13)
    at Compilation.applyPluginsAsync (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:60:69)
    at Compilation. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compilation.js:572:10)
    at Compilation.applyPluginsAsync (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:60:69)
    at Compilation. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compilation.js:567:9)
    at Compilation.applyPluginsAsync (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:60:69)
    at Compilation. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compilation.js:563:8)
    at Compilation.applyPluginsAsync (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:60:69)
    at Compilation.seal (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compilation.js:525:7)
    at Compiler. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compiler.js:397:15)
    at D:\MyProject\project\mmall\doc\mmall-fe\node_modules\tapable\lib\Tapable.js:103:11
    at Compilation. (D:\MyProject\project\mmall\doc\mmall-fe\node_modules\webpack\lib\Compilation.js:445:10)
Child extract-text-webpack-plugin:
        + 5 hidden modules

解决方法:

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

你可能感兴趣的:(个人学习_前端)