Webpack css-loader 找不到 index.js，style-loader 找不到 addStyles.js

Question

./app/index.scss 中的错误
找不到模块:错误:无法解析"file"或“目录”./../node_modules
C:\Users\johnliang\Temp\webpack-angular/app 中的 css-loader/index.js
@ ./app/index.scss 4:14-116 13:2-17:4 14:20-122

./app/index.scss 中的错误
找不到模块:错误:无法解析"file"或“目录”./../node_modules
C:\Users\johnliang\Temp\webpack-angular/app 中的样式加载器/addStyles.js
@ ./app/index.scss 7:13-68

index.scss 没有加载到最终的 webpack 输出中。

Answer 1

我有一个类似的问题，我的 webpack 构建提示 .js文件:

ERROR in ./node_modules/style-loader/lib/addStyles.js
Module not found: Error: Can't resolve './urls' in '/Users/<user>/path/to/project/node_modules/style-loader/lib'
 @ ./node_modules/style-loader/lib/addStyles.js 64:14-31

我一定是从某个教程的某个地方(或许多)复制了这个解决方案，但是与我编写的另一个项目相比，我意识到我错过了 webpack 配置中解析属性的扩展名“.js”:

resolve: {
  extensions: [
    '.scss',
    '.css',
    '.js' // <-- HERE
  ]
},

这为我解决了这个问题，所以一定要试一试。