堆棧內存溢出
  簡體   English   中英

Create-react-app - 插件“react”中的錯誤在“.eslintrc.json”和“BaseConfig”之間發生沖突

[英]Create-react-app - ERROR in Plugin "react" was conflicted between ".eslintrc.json" and "BaseConfig"

 原文  2021-12-22 13:18:22  0   28    reactjs/ eslint/ create-react-app

問題描述

更新到 CRA 5.0.0 后，我在編譯過程中遇到了這個錯誤：

ERROR in Plugin "react" was conflicted between ".eslintrc.json" and "BaseConfig » "..\react-app\node_modules\eslint-config-react-app\base.js".

我的 eslint 配置是：

{
    "env": {
        "browser": true,
        "es2021": true
    },
    "extends": [
        "plugin:react/recommended",
        "airbnb",
        "plugin:react/jsx-runtime"
    ],
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "ecmaVersion": 12,
        "sourceType": "module"
    },
    "plugins": [
        "react",
        "@typescript-eslint"
    ],
    "rules": {...}
}

任何解決方案/修復？

28 個解決方案

解決方案1
 13  2022-03-22 22:36:13

問題：

項目依賴項中的eslint-plugin-react版本與eslint-config-react-app包依賴項中的版本“不同”，因此是“沖突的”。

解決方案：

避免像這里建議的那樣刪除.lock文件（它的存在是有原因的）。 相反，刪除其條目，然后重新安裝。

npm ：

npm dedupe && npm i

紗線：

npx yarn-deduplicate && yarn

解決方案2
 10  2021-12-22 15:27:49

嗯，這似乎與以下問題之一有關。

https://github.com/yannickcr/eslint-plugin-react/issues/3128

https://github.com/facebook/create-react-app/issues/10463

您可以嘗試以下方法（如果第一個不起作用，請嘗試第二個，如果您使用的是 yarn）：

此外，請查看 CRA 發行說明以檢查是否需要執行某些操作，尤其是有關“從 4.0.x 遷移到 5.0.0”的部分，您可能還需要更新react-scripts 。

https://github.com/facebook/create-react-app/releases/tag/v5.0.0

解決方案3
 4  2022-01-20 17:40:21

這可能對 OP 沒有幫助，但就我而言，我已將我的 react 應用程序更新為 MUI 5，並將 eslint 從^7.32.0為^8.7.0 ，但我忘記升級eslint-plugin-react和eslint-plugin-react-hooks和上述錯誤發生在重新加載文件更改時。 將它們分別升級到^7.28.0和^4.3.0解決了我的問題。

解決方案4
 4  2022-03-23 09:45:19

我剛剛運行了npm install --dev eslint-config-react-app命令，錯誤就消失了。 也使用 --include --include=dev而不是--dev 。

還使用以下命令安裝開發依賴項：

npm install --save-dev eslint-config-react-app eslint@^8.0.0

然后在項目的根文件夾中創建一個名為.eslintrc.json的文件，其內容如下：

{
  "extends": "react-app"
}

來源https://www.npmjs.com/package/eslint-config-react-app

解決方案5
 3  2022-04-16 21:58:32

為我解決這個問題的是確保我從終端 cd 進入的路徑與實際路徑具有相同的大小寫。

解決方案6
 2  2022-01-06 14:41:06

我認為這是因為沒有更新的 eslint。 只需將 eslint 版本從 package.json 中的 7.0.0 更改為 8.0.0 對我有用，或者您使用 ZBB30E85411B56DF41296726AB445DCF 在 cli 中更新

解決方案7
 2  2022-10-10 15:25:52

從 package.json 我刪除了：

"eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  }

然后，我用npm start重新啟動了服務器，我的網絡應用程序再次運行。

希望能幫到你

解決方案8
 1  2022-01-05 17:20:57

我只是嘗試在我的項目（與 CRA 5.0.0 一起使用）中使用您的配置，但沒有收到此錯誤。 我認為問題在於您沒有更新一個或幾個與 eslint 相關的軟件包。 您可以嘗試更新它們：

yarn add -D \
eslint@^8.6.0 \
@typescript-eslint/eslint-plugin@^5.9.0 \
@typescript-eslint/parser@^5.9.0 \
eslint-plugin-react@^7.28.0 \
eslint-config-react@^1.1.7 \
eslint-config-airbnb@^19.0.4

或npm install而不是yarn add

解決方案9
 1  2022-02-26 16:43:27

我剛剛將eslint-config-react-app從版本7.0.0降級到6.0.0 ：

yarn add --dev eslint-config-react-app@6.0.0

或者

npm install --dev eslint-config-react-app@6.0.0

也許這會對某人有所幫助。

解決方案10
 1  2022-03-29 13:59:54

對我來說，更新后它起作用了

"eslint-plugin-react": "7.29.4",
"eslint-plugin-jsx-a11y": "6.5.1"

刪除package-lock.json和node_modules並重新安裝 package。

解決方案11
 1  2022-04-16 10:21:56

只需將 eslint-plugin-react 從版本 7.28.x 更新到 7.29.x 對我有用

解決方案12
 1  2022-04-29 22:29:41

在嘗試先前的響應之前。 只需打開您的package.json文件並通過Cntrl + S保存並再次運行您的應用程序，它對我有用。

解決方案13
 1  2022-05-16 15:33:07

如果使用 yarn，請刪除您的yarn.lock並運行：

yarn install

這將重建 .lock 文件，錯誤將 go 消失。

解決方案14
 1  2022-05-30 06:33:30

我能夠通過使用環境變量來解決這個問題。

我將 eslint 安裝為開發依賴項（以及我使用的所有其他插件）。

要讓您的代碼在開發中進行 lint，但不會失敗，請將其添加到 your.env.development： ESLINT_NO_DEV_ERRORS = true

要在生產版本中完全禁用 eslint，請將其添加到 your.env.production： DISABLE_ESLINT_PLUGIN = true

解決方案15
 0  2022-02-01 19:51:37

你用什么終端？ 我不推薦 Windows PowerShell。 使用 PowerShell 新版本可以正常工作。

看圖片 Powershell 我推薦

解決方案16
 0  2022-02-27 19:15:59

今天我遇到了這個問題，在我運行審計修復后——強制 npm 啟動沒有用，但我收到了一條可愛的長消息，解釋了這些步驟以及背后的原因。 我發現它很有幫助並解決了我的問題。

項目依賴樹可能有問題。 這可能不是 Create React App 中的錯誤，而是您需要在本地修復的錯誤。

Create React App 提供的 react-scripts package 需要依賴：

“eslint”：“5.6.0”

不要嘗試手動安裝：您的 package 管理器會自動安裝。 但是，在樹的較高位置檢測到不同版本的 eslint：

C:\Users\rohad\Desktop\project\node_modules\eslint（版本：8.10.0）

眾所周知，手動安裝不兼容的版本會導致難以調試的問題。

如果您希望忽略此檢查，請將 SKIP_PREFLIGHT_CHECK=true 添加到項目中的 .env 文件中。 這將永久禁用此消息，但您可能會遇到其他問題。

要修復依賴關系樹，請嘗試按確切順序執行以下步驟：

  1. 刪除項目文件夾中的 package-lock.json（不是 package.json。）和/或 yarn.lock。
  2. 刪除項目文件夾中的 node_modules。
  3. 從項目文件夾中 package.json 文件中的依賴項和/或 devDependencies 中刪除“eslint”。
  4. 運行 npm install 或 yarn，具體取決於您使用的 package 管理器。

在大多數情況下，這應該足以解決問題。 如果這沒有幫助，您可以嘗試其他一些方法：

  1. 如果您使用 npm，請安裝 yarn ( http://yarnpkg.com/ ) 並用它重復上述步驟。 這可能會有所幫助，因為 npm 已知 package 提升問題，這些問題可能會在未來的版本中得到解決。

  2. 檢查 C:\Users\rohad\Desktop\project\node_modules\eslint 是否在您的項目目錄之外。 例如，您可能不小心在主文件夾中安裝了一些東西。

  3. 嘗試在項目文件夾中運行 npm ls eslint。 這將告訴您哪些其他 package（除了預期的反應腳本）安裝了 eslint。

如果沒有其他幫助，請將 SKIP_PREFLIGHT_CHECK=true 添加到項目中的 .env 文件中。 如果您仍然想繼續，這將永久禁用此預檢檢查。

PS 我們知道這條信息很長，但請閱讀上面的步驟：-) 我們希望它們對您有所幫助！

解決方案17
 0  2022-03-02 15:30:27

就我而言，一切都更新到了最新版本，但我仍然遇到同樣的錯誤。

刪除鎖定文件后，它開始工作

解決方案18
 0  2022-03-29 20:54:17

我遇到了這個問題，因為我在.eslintrc.yml和package.json中都有重復且不一致的聲明。 似乎更新到 CRA 5.0 在 package.json 中添加了以下內容：

"eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },

奇怪的。

解決方案19
 0  2022-04-11 07:56:29

我最近所做的並且 100% 有效的是創建一個新的 reat-app 項目（使用 CRA 5+），並將所有文件和配置移動到該新文件夾中。

解決方案20
 0  2022-05-20 20:45:05

這是對我有用的解決方案。

僅刪除鎖定文件可能對您不起作用。 你只需要從 eslint 中刪除一些包。

所以這是我在 package.json 中的開發依賴項列表，它導致了同樣的錯誤。

"devDependencies": {
    "@babel/eslint-parser": "7.17.0",
    "@babel/preset-react": "7.16.7",
    "eslint": "8.14.0",
    "eslint-config-airbnb": "18.2.0",
    "eslint-config-prettier": "8.5.0",
    "eslint-plugin-html": "6.2.0",
    "eslint-plugin-import": "2.26.0",
    "eslint-plugin-jsdoc": "39.2.8",
    "eslint-plugin-jsx-a11y": "6.5.1",
    "eslint-plugin-prettier": "4.0.0",
    "eslint-plugin-react": "7.29.4",
    "eslint-plugin-react-hooks": "4.4.0",
    "eslint-plugin-testing-library": "5.3.1",
    "husky": "7.0.4",
    "lint-staged": "12.4.0",
    "prettier": "2.6.2"
  }

在刪除不需要的之后，這里是對我有用的依賴項列表

"devDependencies": {
    "@babel/eslint-parser": "7.17.0",
    "@babel/preset-react": "7.16.7",
    "eslint": "8.14.0",
    "eslint-config-airbnb": "18.2.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-config-react-app": "^7.0.1",
    "eslint-plugin-html": "^6.2.0",
    "eslint-plugin-jsdoc": "^39.3.0",
    "eslint-plugin-prettier": "^4.0.0",
    "husky": "7.0.4",
    "lint-staged": "12.4.0",
    "prettier": "2.6.2"
  }
  • 在開發依賴項中替換這些。
  • 刪除鎖定文件和 node_modules
  • 再次運行 yarn/npm install

祝你好運

解決方案21
 0  2022-05-24 08:24:47

在部署到 Vercel 時，我一直遇到這個編譯錯誤。 您可以通過刪除 .eslintrc 文件來解決問題，然后從 package.json 中刪除此部分： "eslintConfig": { "extends": [ "react-app", "react-app/jest" ] },

解決方案22
 0  2022-05-26 05:04:32

嘗試了很多解決方案，但最后，在 CRA 中禁用 ESLint 為我解決了這個問題。 無論如何，我在 IDE 中使用 ESLint，所以那里也不需要它。

這個其他線程有幫助： https://stackoverflow.com/a/70830899/5613884

解決方案23
 0  2022-07-25 07:05:40

我正在使用 eslint-config-import 這對我造成了同樣的問題，只需將其刪除，一切都會正常工作。 所以我認為（react/jsx-runtime）可能是問題的原因

解決方案24
 0  2022-09-08 19:36:51

當我在 .eslintrc.JSON 文件中添加root: true時，它對我來說很好。

此鏈接可能對您有更多幫助點擊這里

解決方案25
 0  2022-09-10 06:03:11

這不是一個大錯誤，您只需要運行此命令npm install --prefer-dedupe或您也可以運行此命令npm config set prefer-dedupe true並且您的錯誤將得到解決。 您可能正在考慮prefer這只是為了版本。 你也可以像這樣運行npm install dedupe它會安裝新版本好吧！

我希望您在此答案后解決了您的錯誤。

解決方案26
 0  2022-10-06 22:47:32

"plugin:react/recommended" and/or "plugin:react/jsx-runtime" from "extends"應該可以修復它。

解決方案27
 0  2022-10-13 13:35:38

我嘗試按照@glenn-mohammad 的建議運行npx yarn-deduplicate && yarn ，但我只得到 SyntaxError。 如果您使用 yarn 2，請嘗試運行

yarn dedupe

有關文檔，請參閱https://yarnpkg.com/cli/dedupe 。

我第一次運行它時，我在所有包上運行它，它導致了 babel 的新錯誤。 如果您遇到這種情況，請嘗試只在有問題的包上運行它。

解決方案28
 0  2022-10-18 16:33:39

我面臨的問題有點不同，但我會在這里發布這個答案，因為谷歌搜索我的問題會將我帶到這個頁面：

簡短回答：

如果項目在 .net 項目中，請注意文件夾結構中的大小寫差異。

長答案

設置：

我們有一個使用托管在 .net 核心項目中的 create react app 的 React 應用程序。 因此，當第一次運行項目構建完成時，visual studio 運行 npm install，然后運行 npm start。 頁面打開並拋出錯誤

錯誤：

[eslint] Plugin "react" was conflicted between "package.json » eslint-config-react-app » C:\test folder\New folder\src\WatchCasing\ClientApp\node_modules\eslint-config-react-app\base.js" and "BaseConfig » C:\test folder\New folder\src\watchCasing\ClientApp\node_modules\eslint-config-react-app\base.js".

看“watchCasing”文件夾名字不一樣，一個是WatchCasing，一個是watchCasing。 在我閱讀這個 github 答案之前，我顯然錯過了這個大小寫差異： github answer

原因及解決方法：

問題的根本原因是解決方案文件 (.sln) 的大小寫錯誤（因為有人做了不正確的重命名）但項目構建良好，因為 Windows 將文件視為不區分大小寫。

通過修復解決方案文件中的大小寫以匹配項目部分中實際文件夾的大小寫，問題得以解決。

Project("{project-guid}") = "project.name", "watchCasing\project.name.csproj", "{different-guid}"

結束項目

解決方案29
 -1  2022-07-30 05:31:47

使用正確的大寫從 cd in from 對我有用。

IE 如果真實路徑是 /Documents/Websites/EXAMPLE/ex1 則不要使用 /Documents/Websites/example/ex1 cd in

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 插件“react”在“.eslintrc.js”和“BaseConfig”之間發生沖突 插件“react”中的錯誤在 部署 React 應用程序時出錯，它一直在說 << Plugin "react" was conflicted between "package.json » eslint-config-react-app » >> 插件“react”在“package.json”之間發生沖突 插件“react”在“package.json » eslint-config-react-app 之間發生沖突 創建反應應用程序錯誤 錯誤：無法加載在“.eslintrc”中聲明的解析器“babel-eslint”：在 create-react-app 中找不到模塊“babel-eslint” ESLint：插件“反應”在兩者之間發生沖突 使用 create-react-app 命令反應錯誤 create-react-app完整性錯誤窗口
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM