Не могу запустить мое приложение React, получаю несколько ошибок - PullRequest
Новая
       19

Не могу запустить мое приложение React, получаю несколько ошибок

1 голос
/ 29 октября 2019

Github ссылка на код: https://github.com/bhatvikrant/IndecisionApp

Я запустил npm i, а затем выполнил yarn run dev-server, я использовал webpack. Я на машине MacOs. Я также сделал файл .babelrc.

Ошибка, которую я получаю после запуска yarn run dev-server: 

VIKRANTs-MacBook-Pro:IndecisionAPP VIKRANT$ yarn run dev-server
yarn run v1.19.1
$ webpack-dev-server
Project is running at http://localhost:8080/
webpack output is served from /
Content not from webpack is served from /Users/VIKRANT/Desktop/IndecisionAPP/public
Hash: 35d055107a6a0062196d
Version: webpack 3.1.0
Time: 1305ms
    Asset    Size  Chunks                    Chunk Names
bundle.js  867 kB       0  [emitted]  [big]  main
  [35] multi (webpack)-dev-server/client?http://localhost:8080 ./src/app.js 40 bytes {0} [built]
  [36] (webpack)-dev-server/client?http://localhost:8080 5.59 kB {0} [built]
  [37] ./node_modules/url/url.js 23.3 kB {0} [built]
  [38] ./node_modules/node-libs-browser/node_modules/punycode/punycode.js 14.7 kB {0} [built]
  [39] ./node_modules/url/util.js 314 bytes {0} [built]
  [40] ./node_modules/querystring-es3/index.js 127 bytes {0} [built]
  [43] ./node_modules/strip-ansi/index.js 161 bytes {0} [built]
  [44] ./node_modules/ansi-regex/index.js 135 bytes {0} [built]
  [45] (webpack)-dev-server/client/socket.js 856 bytes {0} [built]
  [46] ./node_modules/sockjs-client/lib/entry.js 244 bytes {0} [built]
  [77] (webpack)-dev-server/client/overlay.js 3.6 kB {0} [built]
  [78] ./node_modules/ansi-html/index.js 4.26 kB {0} [built]
  [79] ./node_modules/html-entities/index.js 231 bytes {0} [built]
  [82] (webpack)/hot/emitter.js 77 bytes {0} [built]
  [84] ./src/app.js 2.33 kB {0} [built] [failed] [1 error]
    + 70 hidden modules

ERROR in ./src/app.js
Module build failed: Error: Requires Babel "^7.0.0-0", but was loaded with "6.25.0". If you are sure you have a
 compatible version of @babel/core, it is likely that something in your build process is loading the wrong vers
ion. Inspect the stack trace of this error to look for the first entry that doesn't mention "@babel/core" or "b
abel-core" to see what is calling Babel. (While processing preset: "/Users/VIKRANT/Desktop/IndecisionAPP/node_m
odules/@babel/preset-env/lib/index.js")
    at throwVersionError (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/@babel/helper-plugin-utils/lib/inde
x.js:65:11)
    at Object.assertVersion (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/@babel/helper-plugin-utils/lib/i
ndex.js:13:11)
    at /Users/VIKRANT/Desktop/IndecisionAPP/node_modules/@babel/preset-env/lib/index.js:177:7
    at /Users/VIKRANT/Desktop/IndecisionAPP/node_modules/@babel/helper-plugin-utils/lib/index.js:19:12
    at /Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/file/options/option-mana
ger.js:317:46
    at Array.map (<anonymous>)
    at OptionManager.resolvePresets (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/file/options/option-manager.js:275:20)
    at OptionManager.mergePresets (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:10)
    at OptionManager.mergeOptions (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249:14)
    at OptionManager.init (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
    at File.initOptions (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/file/index.js:212:65)
    at new File (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/file/index.js:135:24)
    at Pipeline.transform (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
    at transpile (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-loader/lib/index.js:49:20)
    at Object.module.exports (/Users/VIKRANT/Desktop/IndecisionAPP/node_modules/babel-loader/lib/index.js:174:20)
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src/app.js
webpack: Failed to compile.

Пожалуйста, помогите мне исправить эту синтаксическую ошибку, я потратил почтидень, пытаясь это исправить.

Ответы [ 3 ]

0 голосов
/ 29 октября 2019

Сборка модуля завершилась неудачно: ошибка: требуется Babel "^ 7.0.0-0", но загружен с "6.25.0".

Эта ошибка возникает из-за того, что Babel 7 ивыше требуется. Вы можете обновить его с помощью пакета babel-upgrade: https://www.npmjs.com/package/babel-upgrade

Правильный способ обновления babel можно найти здесь: Как перейти на babel 7 .

0 голосов
/ 29 октября 2019

Я думаю, что вы сделали некоторые шаги курса неправильно, здесь - это package.json, с которым вам, вероятно, следовало бы закончить.

Я предлагаю вам попробовать удалить node_modules, yarnЗатем .lock и package-lock.json помещают следующее содержимое в ваш package.json 

{
  "name": "indecision-app",
  "version": "1.0.0",
  "main": "index.js",
  "author": "Andrew Mead",
  "license": "MIT",
  "scripts": {
    "serve": "live-server public/",
    "build": "webpack",
    "dev-server": "webpack-dev-server"
  },
  "dependencies": {
    "babel-cli": "6.24.1",
    "babel-core": "6.25.0",
    "babel-loader": "7.1.1",
    "babel-plugin-transform-class-properties": "6.24.1",
    "babel-preset-env": "1.5.2",
    "babel-preset-react": "6.24.1",
    "css-loader": "0.28.4",
    "live-server": "^1.2.0",
    "node-sass": "4.5.3",
    "normalize.css": "7.0.0",
    "react": "15.6.1",
    "react-dom": "15.6.1",
    "react-modal": "2.2.2",
    "sass-loader": "6.0.6",
    "style-loader": "0.18.2",
    "validator": "8.0.0",
    "webpack": "3.1.0",
    "webpack-dev-server": "2.5.1"
  }
}

, затем запускаем npm install или yarn install

0 голосов
/ 29 октября 2019

Сначала установите и запустите 'rimraf' .

Затем с здесь :

Мы будемнеобходимо добавить несколько пакетов babel в наш проект с помощью

npm install --save-dev @ babel / core @ babel / cli @ babel / preset-env @ babel / node.

Это соответственнопозаботьтесь о работе с babels, работе с babel в командной строке, возможности использовать новейшие функции JS и использование babel с узлом.

Или вы можете изменить свойФайл 'package.json' на месте (показан ниже) и повторно запустите 'yarn': 

{
  "name": "indecision-app",
  "version": "1.0.0",
  "main": "index.js",
  "author": "Andrew Mead",
  "license": "MIT",
  "scripts": {
    "serve": "live-server public/",
    "build": "webpack",
    "dev-server": "webpack-dev-server"
  },
  "dependencies": {
    "live-server": "^1.2.0",
    "node-sass": "4.5.3",
    "normalize.css": "7.0.0",
    "react": "15.6.1",
    "react-dom": "15.6.1",
    "react-modal": "2.2.2",
    "sass-loader": "6.0.6",
    "style-loader": "0.18.2",
    "validator": "8.0.0",
    "webpack": "3.1.0",
    "webpack-dev-server": "2.5.1"
  },
  "devDependencies": {
    "@babel/core": "^7.6.4",
    "@babel/preset-env": "^7.6.3",
    "@babel/preset-react": "^7.6.3",
    "babel-loader": "^7.1.1",
    "babel-plugin-transform-class-properties": "7.0.0", // upgrade this to 7.0.
    "css-loader": "0.28.4"
  }
}
...