Error: Failed to load plugin 'prettier' declared in '.eslintrc.js » @react-native-community/eslint-config': Cannot find module 'eslint-plugin-prettier' Require stack:

After installing react-native with npx it throws an error on me with eslint settings in webstorm.

Description

I have tried installing prettier on it’s own but it didn’t worked

React Native version: 0.65.1

Run react-native info in your terminal and copy the results here. info Fetching system and libraries information… System: OS: macOS 11.5.2 CPU: (8) arm64 Apple M1 Memory: 179.45 MB / 16.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 16.8.0 - /opt/homebrew/bin/node Yarn: Not Found npm: 7.21.0 - /opt/homebrew/bin/npm Watchman: 2021.08.30.00 - /opt/homebrew/bin/watchman Managers: CocoaPods: 1.11.0 - /opt/homebrew/bin/pod SDKs: iOS SDK: Platforms: iOS 14.5, DriverKit 20.4, macOS 11.3, tvOS 14.5, watchOS 7.4 Android SDK: Not Found IDEs: Android Studio: Arctic Fox 2020.3.1 Patch 2 Arctic Fox 2020.3.1 Patch 2 Xcode: 12.5.1/12E507 - /usr/bin/xcodebuild Languages: Java: Not Found npmPackages: @react-native-community/cli: Not Found react: 17.0.2 => 17.0.2 react-native: 0.65.1 => 0.65.1 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

1. npx react-native some
2. open app in webstorm

Expected Results

Describe what you expected to happen. no errors is shown

Snack, code example, screenshot, or link to a repository:

I haven't changed anything from the app created with npx

[Yrsafam]

I think it’s all caused by peer dependency in npm >=7. In my case, installing dependencies in the old npm 4-6 mode helped, i.e.:

1. Remove node_modules, package-lock.json
2. npm install --legacy-peer-deps

Article about dependencies:

[kendallroth]

I should mention that running the linter by itself also throws this error (not just VSCode).

ESLint: 7.32.0

ESLint couldn't find the plugin "eslint-plugin-prettier".

(The package "eslint-plugin-prettier" was not found when loaded as a Node module from the directory "/Users/kendallroth/Development/payme".)

It's likely that the plugin isn't installed correctly. Try reinstalling by running the following:

    npm install eslint-plugin-prettier@latest --save-dev

The plugin "eslint-plugin-prettier" was referenced from the config file in ".eslintrc.js » @react-native-community/eslint-config"

Installing as instructed/recommended that moves the error to a missing prettier config package.

ESLint: 7.32.0

ESLint couldn't find the config "prettier" to extend from. Please check that the name of the config is correct.

The config "prettier" was referenced from the config file in "/Users/kendallroth/Development/payme/node_modules/eslint-plugin-prettier/eslint-plugin-prettier.js".

Installing eslint-config-prettier in turn mentions an issue with globals/jest.

ESLint: 7.32.0

Error: .eslintrc.js » @react-native-community/eslint-config#overrides[2]:
	Environment key "jest/globals" is unknown