Задать вопрос
@The_XXI
javascript

Почему появляется ошибка при первом запуске React?

Создал приложение через create-react-app
npm i create-react-app
Создал папку приложения и перешел в нее
npm init react-app app
cd app


При запуске приложения через npm start появляется несколько ошибок Cannot find module '@babel/plugin-proposal-private-property-in-object'
Полный код ошибок

Failed to compile.

Error: [BABEL] /Users/mkde/projectsNew/ToDo/app/src/index.js: Cannot find module '@babel/plugin-proposal-private-property-in-object'
Require stack:
- /Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/create.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/module-types.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@rollup/plugin-babel/dist/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-build/build/lib/bundle.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-webpack-plugin/build/generate-sw.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-webpack-plugin/build/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/react-scripts/config/webpack.config.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/react-scripts/scripts/start.js (While processing: "/Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/index.js")
at Generator.next ()
at Generator.next ()
at Generator.next ()
at Generator.next ()
at cachedFunction.next ()
at loadPresetDescriptor.next ()
at recursePresetDescriptors.next ()
at Generator.next ()
at loadFullConfig.next ()
at transform.next ()
at new Promise ()
at Generator.next ()
at new Promise ()
ERROR in ./src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: [BABEL] /Users/mkde/projectsNew/ToDo/app/src/index.js: Cannot find module '@babel/plugin-proposal-private-property-in-object'
Require stack:
- /Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/create.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/module-types.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@rollup/plugin-babel/dist/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-build/build/lib/bundle.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-webpack-plugin/build/generate-sw.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-webpack-plugin/build/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/react-scripts/config/webpack.config.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/react-scripts/scripts/start.js (While processing: "/Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/index.js")
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
at Function.Module._load (node:internal/modules/cjs/loader:778:27)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at module.exports (/Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/create.js:168:9)
at module.exports (/Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/index.js:19:10)
at async (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/gensync-utils/async.js:36:33)
at async (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:186:15)
at /Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:216:13
at Generator.next ()
at /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/full.js:181:21
at Generator.next ()
at Function. (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/gensync-utils/async.js:21:3)
at Generator.next ()
at step (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:269:25)
at evaluateAsync (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:291:5)
at Function.errback (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:113:7)
at errback (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/gensync-utils/async.js:66:18)
at async (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:188:17)
at onFirstPause (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:216:13)
at Generator.next ()
at cachedFunction (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/caching.js:52:46)
at cachedFunction.next ()
at loadPresetDescriptor (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/full.js:294:43)
at loadPresetDescriptor.next ()
at recursePresetDescriptors (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/full.js:77:31)
at recursePresetDescriptors.next ()
at /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/full.js:157:21
at Generator.next ()
at loadFullConfig (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/full.js:113:5)
at loadFullConfig.next ()
at transform (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/transform.js:20:45)
at transform.next ()
at step (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:269:25)
at evaluateAsync (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:291:5)
at errback (/Users/mkde/projectsNew/ToDo/app/node_modules/gensync/index.js:113:7)
at stopHiding - secret - don't use this - v1 (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/errors/rewrite-stack-trace.js:46:12)
at transform (/Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/transform.js:39:72)
at node:internal/util:360:7
at new Promise ()
at transform (node:internal/util:346:12)
at /Users/mkde/projectsNew/ToDo/app/node_modules/babel-loader/lib/transform.js:15:22
at Generator.next ()
at asyncGeneratorStep (/Users/mkde/projectsNew/ToDo/app/node_modules/babel-loader/lib/transform.js:3:103)
at _next (/Users/mkde/projectsNew/ToDo/app/node_modules/babel-loader/lib/transform.js:4:194)
at /Users/mkde/projectsNew/ToDo/app/node_modules/babel-loader/lib/transform.js:4:364
at new Promise ()
at /Users/mkde/projectsNew/ToDo/app/node_modules/babel-loader/lib/transform.js:4:97
at /Users/mkde/projectsNew/ToDo/app/node_modules/babel-loader/lib/transform.js:48:17
at /Users/mkde/projectsNew/ToDo/app/node_modules/babel-loader/lib/cache.js:130:26

ERROR in [eslint]
src/index.js
Line 0: Parsing error: [BABEL] /Users/mkde/projectsNew/ToDo/app/src/index.js: Cannot find module '@babel/plugin-proposal-private-property-in-object'
Require stack:
- /Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/create.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/module-types.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/config/files/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@babel/core/lib/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/@rollup/plugin-babel/dist/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-build/build/lib/bundle.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-webpack-plugin/build/generate-sw.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/workbox-webpack-plugin/build/index.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/react-scripts/config/webpack.config.js
- /Users/mkde/projectsNew/ToDo/app/node_modules/react-scripts/scripts/start.js (While processing: "/Users/mkde/projectsNew/ToDo/app/node_modules/babel-preset-react-app/prod.js")


Как это исправить?
Я пробовал поставить babel и добавлял в корень babel.config.js с кодом
module.exports = {
  babelrcRoots: [
    ".",
    "static/project-b/*"
  ]
};

Это не помогло
  • Вопрос задан
  • 241 просмотр
Комментировать
Подписаться 1 Простой Комментировать
Помогут разобраться в теме Все курсы
  • Нетология
    Fullstack-разработчик на Python + нейросети
    20 месяцев
    Далее
  • Skillfactory
    Профессия Веб-разработчик
    12 месяцев
    Далее
  • Академия Eduson
    Fullstack-разработчик на JavaScript
    11 месяцев
    Далее
Решения вопроса 1
rqdkmndh
@rqdkmndh
Web-разработчик
npx i create-react-app

нужно было не npm, а npx, почитайте внимательно документацию
ну и конечно, аргументом сразу имя каталога в котором хотите реакт установить
npx create-react-app my-app
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Разработчик (Next.js / JavaScript / TypeScript)
App Company
от 200 000 до 300 000 ₽
Web-разработчик/WordPress программист (Full-stack)
JustBusiness • Санкт-Петербург
от 130 000 до 150 000 ₽
React разработчик
ITK academy • Нижний Новгород
от 50 000 до 90 000 ₽
Ещё вакансии