javascript - 按照 my-app 教程中的说明进行操作时，React JS 抛出错误

Question

我是 React JS 的初学者，在浏览 my-app 应用程序的教程时，我看到以下错误

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页面底部的导出更改为默认导出App