typescript ESLint错误- ESLint找不到配置“react-app”

2uluyalo 于 2023-06-24 发布在 TypeScript

关注(0)|答案(8)|浏览(187)

我和我的团队，使用create-react-app bootstrap命令启动一个新的React项目。我们在项目上添加了eslint部分，但我们坚持与恼人的错误，我们从来没有发现它之前现在。当我们发射指令时

yarn run lint

这里的错误：

这里是包.json：

{
  "name": "name of the app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "jwt-decode": "^2.2.0",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-intl": "^3.12.0",
    "react-router": "^5.1.2",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.3.0",
    "redux": "^4.0.5",
    "redux-saga": "^1.1.3",
    "reselect": "^4.0.0",
    "styled-components": "^5.0.1"
  },
  "scripts": {
    "analyze": "react-app-rewired build",
    "build": "react-scripts build",
    "cypress": "./node_modules/.bin/cypress open",
    "eject": "react-scripts eject",
    "lint:write": "eslint --debug src/ --fix",
    "lint": "eslint --debug src/",
    "prettier": "prettier --write src/*.tsx src/*.ts src/**/*.tsx src/**/*.ts src/**/**/*.tsx src/**/**/*.ts src/**/**/**/*.tsx src/**/**/**/*.ts src/**/**/**/**/*.tsx src/**/**/**/**/*.ts",
    "start": "react-scripts start",
    "storybook": "start-storybook -p 6006 -c .storybook",
    "test": "react-scripts test",
    "upgrade:check": "npm-check",
    "upgrade:interactive": "npm-check --update"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "lint-staged": {
    "*.(ts|tsx)": [
      "yarn run prettier"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@cypress/webpack-preprocessor": "^4.1.2",
    "@storybook/addon-actions": "^5.3.12",
    "@storybook/addon-info": "^5.3.12",
    "@storybook/addon-knobs": "^5.3.12",
    "@storybook/addon-links": "^5.3.12",
    "@storybook/addons": "^5.3.12",
    "@storybook/preset-create-react-app": "^1.5.2",
    "@storybook/react": "^5.3.12",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/jest": "^24.0.0",
    "@types/jwt-decode": "^2.2.1",
    "@types/node": "^12.0.0",
    "@types/react": "^16.9.0",
    "@types/react-dom": "^16.9.0",
    "@types/react-redux": "^7.1.7",
    "@types/react-router": "^5.1.4",
    "@types/react-router-dom": "^5.1.3",
    "@types/storybook__addon-knobs": "^5.2.1",
    "@types/styled-components": "^4.4.2",
    "cypress": "^4.0.1",
    "eslint": "^6.8.0",
    "husky": "^4.2.1",
    "lint-staged": "^10.0.7",
    "npm-check": "^5.9.0",
    "prettier": "^1.19.1",
    "react-app-rewire-webpack-bundle-analyzer": "^1.1.0",
    "react-app-rewired": "^2.1.5",
    "react-docgen-typescript-webpack-plugin": "^1.1.0",
    "redux-devtools-extension": "^2.13.8",
    "storybook-addon-jsx": "^7.1.14",
    "ts-loader": "^6.2.1",
    "typescript": "~3.7.2",
    "webpack": "^4.41.6",
    "webpack-bundle-analyzer": "^3.6.0"
  }
}

我们还尝试添加创建一个.eslintrc文件并添加

{
  "extends": "react-app"
}

但一切都没有改变。

typescript

来源：https://stackoverflow.com/questions/60431931/eslint-error-eslint-couldnt-find-the-config-react-app

8条答案

按热度按时间

iklwldmw1#

react-scripts应该已经在Node依赖项中包含ESLint和eslint-config-react-app ESLint配置（请参阅文档）。
您不需要在Create React App项目中单独安装它。
如果ESLint无法找到react-app配置，则可能存在安装在react-scripts之外的冲突或重复的ESLint配置依赖项（即另一个eslint-config-react-app安装）。您可以使用npm ls [package]命令（即npm ls eslint-config-react-app）。
可能最好的方法是从package.json中删除这些包，以允许像react-scripts中的eslint-config-react-app这样的配置按预期使用（基于注解）。如果在此之后问题仍然存在，请尝试删除node_modules文件夹和package-lock.json，然后重新安装依赖项可能有效。否则，升级到较新的npm版本可能会有所不同。

旧答案：

您的package.json可能缺少对等依赖项eslint-config-react-app，其中包括eslint预设react-app。您需要按照说明在此处安装https://www.npmjs.com/package/eslint-config-react-app。
注意：即使这是create-react-app，它捆绑了react-scripts，您的lint脚本也无法访问react-app。

"eslintConfig": {
      "extends": "react-app"   
}

关于.eslintrc，您已经在package.json中配置了ESLint，因此您应该可以安全地删除.eslintrc。

赞(0）回复(0）举报 2023-06-24

gorkyyrv2#

这里的问题是yarn包管理器。因为eslint-config-react-app不在node_modules下面，而是在react-scripts里面：node_modules\react-scripts\node_modules yarn没有正确加载（更多信息在这里）
因此，目前有两种选择来解决这个问题：
1.使用npm而不是yarn。
1.安装eslint-config-react-app软件包，除了我们在react-scripts中的软件包。

赞(0）回复(0）举报 2023-06-24

92vpleto3#

我用npm install代替yarn解决了这个问题。
不知道为什么，但我猜这是因为yarn一次安装多个包，而npm一个接一个地安装它们。所以可能其中一些被跳过或没有正确安装。

赞(0）回复(0）举报 2023-06-24

wnvonmuf4#

解决了！
我解决了更改lint脚本的问题：
老这个：

"lint": "eslint --debug src/"

新的：

"lint": "eslint --debug 'src/**/*.{js,jsx,ts,tsx}'",

赞(0）回复(0）举报 2023-06-24

lymgl2op5#

朋友们，在你的React app中做这些步骤就可以了（你可以在create-react-app或者viteapp中使用这些步骤）：
1.将eslint-config-react-app安装为devDependencies（可能您已经有此包，只需重新安装即可）：
npm i -D eslint-config-react-app
1.将下面的代码添加到.eslintrc.cjs或.eslintrc.js：

{
   "extends": [
      "eslint:recommended",
      "react-app"
    ],
}

您可以在eslint discord中找到此问题

赞(0）回复(0）举报 2023-06-24

roejwanj6#

我使用的是yarn，我通过重新安装vscode并将eslint降级到7.32解决了这个问题

赞(0）回复(0）举报 2023-06-24

uhry853o7#

如果你在你的项目中没有使用React，只需在.eslintrc.js中添加以下内容：

{
   root: true,
}

赞(0）回复(0）举报 2023-06-24

aemubtdh8#

从**.git/hooks中删除pre-commit**文件解决了我的问题。

赞(0）回复(0）举报 2023-06-24

我来回答

typescript ESLint错误- ESLint找不到配置“react-app”

8条答案

旧答案：

相关问题

热门标签

最新问答