遵循my-app教程中的說明時，React JS引發錯誤

Question

我是React JS的初學者，在閱讀我的應用程序應用程序的教程時，看到以下錯誤

Failed to compile:
./src/index.js
Attempted import error: './App' does not contain a default export (imported as 'App').

為了解決此問題，我確實在相同目錄中再次創建了“ my-app”項目，然后嘗試啟動npm，然后遇到以下錯誤，請問有人可以解決此問題嗎？ 如果您指出我所犯的錯誤，那也將非常有幫助。

E:\ReactJS\demo\my-app>npm start

> my-app@1.0.0 start E:\ReactJS\demo\my-app
> if-env NODE_ENV=production && npm run react-project:start:prod || npm run react-project:start:dev


> my-app@1.0.0 react-project:start:dev E:\ReactJS\demo\my-app
> eslint modules && react-project start

E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-file.js:332
            throw e;
            ^

Error: react-app:
        Configuration for rule "array-callback-return" is invalid:
        Value "warn" is the wrong type.

Referenced from: E:\ReactJS\demo\package.json
    at validateRuleOptions (E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-validator.js:102:15)
    at E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-validator.js:148:13
    at Array.forEach (<anonymous>)
    at Object.validate (E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-validator.js:147:35)
    at load (E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-file.js:390:19)
    at E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-file.js:326:36
    at Array.reduceRight (<anonymous>)
    at applyExtends (E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-file.js:309:28)
    at Object.load (E:\ReactJS\demo\my-app\node_modules\eslint\lib\config\config-file.js:395:22)
    at loadConfig (E:\ReactJS\demo\my-app\node_modules\eslint\lib\config.js:74:33)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! my-app@1.0.0 react-project:start:dev: `eslint modules && react-project start`
npm ERR! Exit status 1

完全不確定該錯誤，盡管其中大多數看起來與自己下載的軟件包有關。

.eslintrc：

{“ extends”：“ rackt”，“ globals”：{“ DEV ”：true}，“ rules”：{“ react / jsx-uses-react”：1，“ react / jsx-no-undef”：2， “ react / wrap-multilines”：2}，“ plugins”：[“ react”]}

和package.json：

{
  "name": "my-app",
  "version": "1.0.0",
  "private": true,
  "description": "",
  "react-project": {
    "server": "modules/server.js",
    "client": "modules/client.js",
    "webpack": "webpack.config.js"
  },
  "scripts": {
    "start": "if-env NODE_ENV=production && npm run react-project:start:prod || npm run react-project:start:dev",
    "test": "karma start",
    "react-project:start:dev": "eslint modules && react-project start",
    "react-project:start:prod": "rm -rf .build && react-project build && node .build/server.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel-cli": "6.5.1",
    "babel-core": "6.5.1",
    "babel-eslint": "4.1.8",
    "babel-loader": "6.2.2",
    "babel-preset-es2015": "6.5.0",
    "babel-preset-react": "6.5.0",
    "babel-preset-react-hmre": "1.1.0",
    "babel-preset-stage-1": "6.5.0",
    "body-parser": "1.15.0",
    "bundle-loader": "0.5.4",
    "compression": "1.6.1",
    "css-loader": "0.23.1",
    "dotenv": "2.0.0",
    "eslint": "1.10.3",
    "eslint-config-rackt": "1.1.1",
    "eslint-plugin-react": "3.16.1",
    "expect": "1.14.0",
    "express": "4.13.4",
    "extract-text-webpack-plugin": "1.0.1",
    "file-loader": "0.8.5",
    "helmet": "1.1.0",
    "hpp": "0.2.0",
    "if-env": "1.0.0",
    "karma": "0.13.21",
    "karma-chrome-launcher": "0.2.2",
    "karma-mocha": "0.2.2",
    "karma-mocha-reporter": "1.2.0",
    "karma-sourcemap-loader": "0.3.7",
    "karma-webpack": "1.7.0",
    "mocha": "2.4.5",
    "morgan": "1.7.0",
    "node-fetch": "1.3.3",
    "null-loader": "0.1.1",
    "postcss-loader": "0.8.1",
    "react": "0.14.7",
    "react-dom": "0.14.7",
    "react-project": "0.0.30",
    "react-router": "2.0.0",
    "react-title-component": "1.0.1",
    "source-map-support": "0.4.0",
    "style-loader": "0.13.0",
    "url-loader": "0.5.7",
    "webpack": "1.12.14",
    "webpack-dev-server": "1.14.1"
  }
}

Answer 1

看起來您導出的App組件不正確。 將./App頁面底部的導出更改為default export App