🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
ESLint

ESLintは、JavaScriptのための構文チェックツール。全検証ルールを自由に on/offでき、独自のプロジェクトに合わせたカスタムルールを容易に設定することが可能。公開されている様々なプラグインを組み込んで使用することもできます。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

解決済

1回答

2102閲覧

eslintでモジュール、プラグインの重複エラーを解消したい

gomes_2222

総合スコア94

ESLint

ESLintは、JavaScriptのための構文チェックツール。全検証ルールを自由に on/offでき、独自のプロジェクトに合わせたカスタムルールを容易に設定することが可能。公開されている様々なプラグインを組み込んで使用することもできます。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2023/03/04 09:31

編集2023/03/05 09:41

実現したいこと

エラーを解消したいのですが、何度やっても消えません。
どういう状況になってしまってるのでしょうか?

前提

reactにeslintを導入しています。
導入に伴い、yarnで色々パッケージをインストールしました。

発生している問題・エラーメッセージ

[eslint] Plugin "jest" was conflicted between ".eslintrc.json » eslint-config-react-app/jest" and ".eslintrc.json » plugin:jest/recommended".

該当のソースコード

eslintrc.json

1{ 2 "root": true, 3 "extends": [ 4 "airbnb", 5 "airbnb/hooks", 6 "eslint:recommended", 7 "plugin:@typescript-eslint/eslint-recommended", 8 "plugin:@typescript-eslint/recommended", 9 "plugin:import/errors", 10 "plugin:import/typescript", 11 "plugin:import/warnings", 12 "plugin:jest/recommended", 13 "plugin:react/recommended", 14 "plugin:react-hooks/recommended", 15 "prettier", 16 "react-app", 17 "react-app/jest" 18 ], 19 "plugins": [ 20 "import", 21 "jest", 22 "react", 23 "react-hooks", 24 "@typescript-eslint" 25 ], 26 "parserOptions": { 27 "ecmaVersion": "latest", 28 "sourceType": "module" 29 }, 30 "env": { 31 "browser": true, 32 "es2021": true 33 }, 34 "globals": {}, 35 "rules": { 36 "no-undef": "off", 37 "no-unused-vars": "error", 38 "camelcase": "off", 39 "import/extensions": [ 40 "error", 41 "ignorePackages", 42 { 43 "js": "never", 44 "jsx": "never", 45 "json": "never", 46 "ts": "never", 47 "tsx": "never" 48 }], 49 "react/jsx-props-no-spreading": "off", 50 "react/jsx-filename-extension": [ 51 "error", 52 { "extensions": [".jsx", ".tsx"] } 53 ], 54 "react/function-component-definition": [ 55 2, 56 { 57 "namedComponents": "function-declaration", 58 "unnamedComponents": "function-expression" 59 } 60 ] 61 }, 62 "settings": { 63 "import/resolver": { 64 "webpack": { 65 "config": "webpack.config.js" 66 } 67 } 68 } 69} 70

package.json

1{ 2 "name": "react-app", 3 "version": "0.1.0", 4 "private": true, 5 "dependencies": { 6 "@emotion/react": "^11.10.6", 7 "@emotion/styled": "^11.10.6", 8 "@mui/icons-material": "^5.11.11", 9 "@mui/material": "^5.11.11", 10 "autoprefixer": "^10.4.13", 11 "axios": "^0.27.2", 12 "axios-case-converter": "^0.9.0", 13 "js-cookie": "^3.0.1", 14 "postcss": "^8.4.21", 15 "react": "^18.2.0", 16 "typescript": "^4.9.5", 17 "web-vitals": "^2.1.4" 18 }, 19 "scripts": { 20 "start": "react-scripts start", 21 "build": "react-scripts build", 22 "test": "react-scripts test", 23 "eject": "react-scripts eject", 24 "jest-test": "jest", 25 "lint": "eslint './react-app/src/*.tsx'", 26 "prettier": "prettier './react-app/src/*.tsx'", 27 "fix": "yarn format && yarn lint:fix", 28 "format": "prettier --write 'src/**/*.{js,jsx,ts,tsx}'", 29 "lint:fix": "eslint --fix './react-app/src/*.tsx'" 30 }, 31 "browserslist": { 32 "production": [ 33 ">0.2%", 34 "not dead", 35 "not op_mini all" 36 ], 37 "development": [ 38 "last 1 chrome version", 39 "last 1 firefox version", 40 "last 1 safari version" 41 ] 42 }, 43 "devDependencies": { 44 "@swc/core": "^1.3.37", 45 "@swc/jest": "^0.2.24", 46 "@testing-library/jest-dom": "^5.16.5", 47 "@testing-library/react": "^13.4.0", 48 "@testing-library/react-hooks": "^8.0.1", 49 "@testing-library/user-event": "^13.5.0", 50 "@types/jest": "^28.1.8", 51 "@types/js-cookie": "^3.0.3", 52 "@types/node": "^16.18.14", 53 "@types/react": "^18.0.28", 54 "@types/react-test-renderer": "^18.0.0", 55 "@typescript-eslint/eslint-plugin": "^5.54.0", 56 "@typescript-eslint/parser": "^5.54.0", 57 "esbuild": "^0.17.11", 58 "esbuild-jest": "^0.5.0", 59 "eslint": "^8.35.0", 60 "eslint-config-airbnb": "^19.0.4", 61 "eslint-config-prettier": "^8.6.0", 62 "eslint-import-resolver-webpack": "^0.13.2", 63 "eslint-plugin-import": "^2.27.5", 64 "eslint-plugin-jest": "^26.9.0", 65 "eslint-plugin-jsx-a11y": "^6.7.1", 66 "eslint-plugin-react": "^7.32.2", 67 "eslint-plugin-react-hooks": "^4.6.0", 68 "eslint-plugin-unused-imports": "^2.0.0", 69 "jest": "^28.1.3", 70 "jest-environment-jsdom": "^29.4.3", 71 "jest-fetch-mock": "^3.0.3", 72 "postcss-loader": "^7.0.2", 73 "prettier": "^2.8.4", 74 "pretty-quick": "^3.1.3", 75 "react-test-renderer": "^18.2.0", 76 "ts-jest": "^28.0.8" 77 } 78} 79

試したこと

・esrintrc,jsonの
jestの記述削除

 "plugins": [ "import", "jest",//これを削除 "react", "react-hooks", "@typescript-eslint" ],

・各種パッケージの更新→node_modueの再インストール

・yarn.lock を削除→下記コマンドを実行

yarn install

いずれも変化なしでした。

補足情報(FW/ツールのバージョンなど)

react
eslint
typescript

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

jestが二重に呼び出され、そのバージョンが違うためにエラー。
eslint-plugin-jestをアンインストールして解決。

投稿2023/03/07 07:32

編集2023/03/07 09:23
gomes_2222

総合スコア94

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問