React模块错误sass-loader和类型错误resolve-url-loader

Question

我想了解更多 React 的知识，因为我现在的大学项目需要它。我从一位不错的开发人员那里得到了 2 个项目，但我无法在我的计算机上运行它们而不出现任何错误。

我总是收到关于 sass-loader 和resolve-url-loader 的 2 种不同类型的错误。

ERROR in ./src/base-style.scss (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[2]!./node_modules/react-scripts/node_modules/resolve-url-loader/index.js??ruleSet[1].rules[1].oneOf[7].use[3]!./node_modules/react-scripts/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[4]!./src/base-style.scss)
Module Error (from ./node_modules/react-scripts/node_modules/sass-loader/dist/cjs.js):
Cannot read properties of undefined (reading 'indexOf')

和

ERROR in ./src/base-style.scss (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[2]!./node_modules/react-scripts/node_modules/resolve-url-loader/index.js??ruleSet[1].rules[1].oneOf[7].use[3]!./node_modules/react-scripts/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[4]!./src/base-style.scss)
Module build failed (from ./node_modules/react-scripts/node_modules/resolve-url-loader/index.js):
TypeError: Cannot read properties of undefined (reading 'replace')
    at process (M:\Uni\SofN\frontend\node_modules\react-scripts\node_modules\resolve-url-loader\lib\engine\postcss.js:28:19)
    at Object.resolveUrlLoader (M:\Uni\SofN\frontend\node_modules\react-scripts\node_modules\resolve-url-loader\index.js:213:14)

我在另一篇文章中读到我的 package.json 中的 devDependency 很重要

 "devDependencies": {
    "@babel/plugin-proposal-private-property-in-object": "^7.16.7",
    "css-loader": "^6.8.1",
    "gh-pages": "^5.0.0",
    "node-sass": "^7.0.3",
    "resolve-url-loader": "^5.0.0",
    "sass": "^1.69.4",
    "sass-loader": "^13.3.2",
    "style-loader": "^3.3.3",
    "webpack": "^5.89.0"
  }

我尝试了在 stackoverflow 上看到的或者同学告诉我的多种方法。我尝试更新所有加载程序，尝试删除并重新安装它们，删除节点模块并再次安装 npm 等。 我也尝试过更改 webpack.config 文件，但我不能保证我做的完全正确。

我希望项目可能出了问题，但在另一个朋友的笔记本上它运行良好，除了一些其他奇怪的 Javascript 错误，但与我得到的错误不相似。

Answer 1

检查您的 Node 和 npm 版本 节点-v npm -v

我今天遇到了这个问题，我所做的就是将节点降级到版本 19.9.0 如果您的版本是 21.0.0，您所需要做的就是降级您的节点。只需卸载node并下载v19.9.0 访问：nodejs-v19.9.0