При запуске npm run build возникает проблема

Я подаю заявку npm run build и получаю:

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 |

Я проверяю свой 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"
  },

Я думаю, что все в порядке, почему я получаю ошибки при запуске сборки ??

Я попытался удалить папку node_modules, и это не сработало, затем я попытался удалить файл package-lock.json, но это тоже не сработало.

Я только что столкнулся с точно такой же проблемой, раньше ее не было, странно

ProgrammingFreak 17.05.2023 20:26

это так странно, потому что проблемы возникли из-за файлов node_modules, это невозможно

Jhon Estrada 17.05.2023 20:33

То же самое здесь, но только на моих удаленных сборках (Vercel). Локальный работает нормально. этот пост предлагает понизить версию webpack до 5.82.0, но мне это не помогло.

Chris J. Zähller 17.05.2023 20:57
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
5
3
341
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Понизить до 5.82.1 Здесь можно посмотреть обсуждение: https://github.com/webpack/webpack/issues/17213

Подтверждаю, получилось:

добавить в package.json для нпм

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

для пряжи

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

Та же ошибка здесь, но эта модификация не исправила ее. Я пытаюсь создать проект React, начатый вчера.

Cirrocumulus 18.05.2023 14:37

Просьба добавить, ради других новичков, что после добавления этой модификации нужно удалить package-lock.json и папку node_modules, и сделать npm install. Спасибо за быстрое решение.

Cirrocumulus 18.05.2023 15:01

Другие вопросы по теме