“running npm run build getting issue” 可以翻译为 “运行 npm run build 时出现问题”。

huangapple
go评论74阅读模式
英文:

running npm run build getting issue

问题

I'm applying npm run build and I'm getting:

创建一个优化的生产构建...
无法编译。

HookWebpackError: 无法读取未定义的属性（读取 'e'）
-- 内部错误 --
TypeError: 无法读取未定义的属性（读取 'e'）
为 C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\postcss-loader\dist\cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\source-map-loader\dist\cjs.js!C:\Users\Gerso\OneDrive\Documentos\React JS\home\src\index.css 生成的代码
 1 | __webpack_require__.r(__webpack_exports__);
 2 | /* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("C:\\Users\\Gerso\\OneDrive\\Documentos\\React JS\\home\\node_modules\\babel-loader\\lib\\index.js??ruleSet[1].rules[1].oneOf[4]!C:\\Users\\Gerso\\OneDrive\\Documentos\\React JS\\home\\node_modules\\source-map-loader\\dist\\cjs.js!C:\\Users\\Gerso\\OneDrive\\Documentos\\React JS\\home\\node_modules\\css-loader\\dist\\runtime\\sourceMaps.js");
 3 | /* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
 4 | /* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("C:\\Users\\Gerso\\OneDrive\\Documentos\\React JS\\home\\node_modules\\babel-loader\\lib\\index.js??ruleSet[1].rules[1].oneOf[4]!C:\\Users\\Gerso\\OneDrive\\Documentos\\React JS\\home\\node_modules\\source-map-loader\\dist\\cjs.js!C:\\Users\\Gerso\\OneDrive\\Documentos\\React JS\\home\\node_modules\\css-loader\\dist\\runtime\\api.js");
 5 | /* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
 6 | // 导入
 7 |
 8 |
 9 | var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
10 | // 模块
11 | ___CSS_LOADER_EXPORT___.push([module.id, ".font-msg {\r\n  font-family: 'Hanalei Fill', cursive;\r\n  border: 100px;\r\n}\r\n\r\n.skillHover:hover{\r\n  background-color: #ebebeb !important;\r\n  border-left: 10px solid midnightblue !important;\r\n  border-radius: 0% !important;\r\n  box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;\r\n}\r\n\r\n.textSkill{\r\n  color: rgb(124, 124, 124);\r\n  font-size: 1rem;\r\n}\r\n\r\n.contact{\r\n  margin: auto !important;\r\n  background-color: #ebebeb !important;\r\n  background:'#f1f1f1' !important;\r\n  border-radius:'10px'  !important;\r\n}\r\n\r\n.text404{\r\n  color: midnightblue !important;;\r\n}\r\n\r\n@media (max-width: 700px){\r\n  .image{\r\n    height: auto !important;\r\n  }\r\n\r\n  .logobrain{\r\n    height: 40vh !important;\r\n    width: 40vh !important;\r\n  }\r\n} ", "",{"version":3,"sources":["webpack://./src/index.css"],"names":[],"mappings":"AAAA;EACE,oCAAoC;EACpC,aAAa;AACf;;AAEA;EACE,oCAAoC;EACpC,+CAA+C;EAC/C,4BAA4B;EAC5B,uHAAuH;AACzH;;AAEA;EACE,yBAAyB;EACzB,eAAe;AACjB;;AAEA;EACE,uBAAuB;EACvB,oCAAoC;EACpC,+BAA+B;EAC/B,gCAAgC;AAClC;;AAEA;EACE,8BAA8B;AAChC;;AAEA;EACE;IACE,uBAAuB;EACzB;;EAEA;IACE,uBAAuB;IACvB,sBAAsB;EACxB;AACF","sourcesContent":[".font-msg {\r\n  font-family: 'Hanalei Fill', cursive;\r\n  border: 100px;\r\n}\r\n\r\n.skillHover:hover{\r\n  background-color: #ebebeb !important;\r\n  border-left: 10px solid midnightblue !important;\r\n  border-radius: 0% !important;\r\n  box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;\r\n}\r\n\r\n.textSkill{\r\n  color: rgb(124, 124, 124);\r\n  font-size: 

<details>
<summary>英文:</summary>

I&#39;m applying ```npm run build``` and I&#39;m getting:

Creating an optimized production build...
Failed to compile.

HookWebpackError: Cannot read properties of undefined (reading 'e')
-- inner error --
TypeError: Cannot read properties of undefined (reading 'e')
Generated code for C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\postcss-loader\dist\cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\source-map-loader\dist\cjs.js!C:\Users\Gerso\OneDrive\Documentos\React JS\home\src\index.css
1 | webpack_require.r(webpack_exports);
2 | /* harmony import / var node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0_ = webpack_require("C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\babel-loader\lib\index.js??ruleSet[1].rules[1].oneOf[4]!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\source-map-loader\dist\cjs.js!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\css-loader\dist\runtime\sourceMaps.js");
3 | / harmony import / var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /#PURE/webpack_require.n(node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0_);
4 | / harmony import / var node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1_ = webpack_require("C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\babel-loader\lib\index.js??ruleSet[1].rules[1].oneOf[4]!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\source-map-loader\dist\cjs.js!C:\Users\Gerso\OneDrive\Documentos\React JS\home\node_modules\css-loader\dist\runtime\api.js");
5 | / harmony import / var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /#PURE/webpack_require.n(node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1_);
6 | // Imports
7 |
8 |
9 | var CSS_LOADER_EXPORT = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
10 | // Module
11 | CSS_LOADER_EXPORT.push([module.id, ".font-msg {\r\n font-family: 'Hanalei Fill', cursive;\r\n border: 100px;\r\n}\r\n\r\n.skillHover:hover{\r\n background-color: #ebebeb !important;\r\n border-left: 10px solid midnightblue !important;\r\n border-radius: 0% !important;\r\n box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;\r\n}\r\n\r\n.textSkill{\r\n color: rgb(124, 124, 124);\r\n font-size: 1rem;\r\n}\r\n\r\n.contact{\r\n margin: auto !important;\r\n background-color: #ebebeb !important;\r\n background:'#f1f1f1' !important;\r\n border-radius:'10px' !important;\r\n}\r\n\r\n.text404{\r\n color: midnightblue !important;;\r\n}\r\n\r\n@media (max-width: 700px){\r\n .image{\r\n height: auto !important;\r\n }\r\n\r\n .logobrain{\r\n height: 40vh !important;\r\n width: 40vh !important;\r\n }\r\n} ", "",{"version":3,"sources":["webpack://./src/index.css"],"names":[],"mappings":"AAAA;EACE,oCAAoC;EACpC,aAAa;AACf;;AAEA;EACE,oCAAoC;EACpC,+CAA+C;EAC/C,4BAA4B;EAC5B,uHAAuH;AACzH;;AAEA;EACE,yBAAyB;EACzB,eAAe;AACjB;;AAEA;EACE,uBAAuB;EACvB,oCAAoC;EACpC,+BAA+B;EAC/B,gCAAgC;AAClC;;AAEA;EACE,8BAA8B;AAChC;;AAEA;EACE;IACE,uBAAuB;EACzB;;EAEA;IACE,uBAAuB;IACvB,sBAAsB;EACxB;AACF","sourcesContent":[".font-msg {\r\n font-family: 'Hanalei Fill', cursive;\r\n border: 100px;\r\n}\r\n\r\n.skillHover:hover{\r\n background-color: #ebebeb !important;\r\n border-left: 10px solid midnightblue !important;\r\n border-radius: 0% !important;\r\n box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;\r\n}\r\n\r\n.textSkill{\r\n color: rgb(124, 124, 124);\r\n font-size: 1rem;\r\n}\r\n\r\n.contact{\r\n margin: auto !important;\r\n background-color: #ebebeb !important;\r\n background:'#f1f1f1' !important;\r\n border-radius:'10px' !important;\r\n}\r\n\r\n.text404{\r\n color: midnightblue !important;;\r\n}\r\n\r\n@media (max-width: 700px){\r\n .image{\r\n height: auto !important;\r\n }\r\n\r\n .logobrain{\r\n height: 40vh !important;\r\n width: 40vh !important;\r\n }\r\n} "],"sourceRoot":""}]);
12 | // Exports
13 | CSS_LOADER_EXPORT.locals = {};
14 | / harmony default export */ webpack_exports.d.e.f.a.u.l.t = (CSS_LOADER_EXPORT);
15 |


I check my ```package.json```

"dependencies": {
"@emotion/react": "^11.6.0",
"@emotion/styled": "^11.6.0",
"@fontsource/roboto": "^4.5.1",
"@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.11.2",
"@mui/material": "^5.1.1",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^12.8.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-responsive-image": "^5.0.0",
"react-router-dom": "^5.3.0",
"react-scripts": "^5.0.1",
"react-tooltip": "^4.2.21",
"responsive-img-material-ui": "^2.2.0",
"web-vitals": "^1.1.2"
},


I&#39;m thinking it&#39;s ok, why I&#39;m getting errors when I run build??


I tried deleting folder node_modules, and didn&#39;t work, then I tried deleting package-lock.json file and did&#39;t work too.

</details>


# 答案1
**得分**: 2

降级至 5.82.1
在这里你可以看到讨论：https://github.com/webpack/webpack/issues/17213

我确认它有效：

在 package.json 中添加
对于 npm

    "overrides": {
       "webpack":"5.82.1"
    },

对于 yarn

    "resolutions": {
       "webpack":"5.82.1"
    },

<details>
<summary>英文:</summary>

Downgrade to 5.82.1
Here you can see the discussion: https://github.com/webpack/webpack/issues/17213

I confirm it worked:


add in the package.json
for npm

    &quot;overrides&quot;: {
       &quot;webpack&quot;:&quot;5.82.1&quot;
    },

for yarn

    &quot;resolutions&quot;: {
       &quot;webpack&quot;:&quot;5.82.1&quot;
    },

</details>

huangapple
  • 本文由 发表于 2023年5月18日 00:55:14
  • 转载请务必保留本文链接：https://go.coder-hub.com/76274486.html
  • build
  • npm
  • reactjs
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定