Why the error while installing prettier?

Question

JavaScript

Good afternoon! Please explain why when installing prettier, eslint-plugin-prettier webstorm swear that

Error: Failed to load plugin prettier/react: Cannot find module 'eslint-plugin-prettier/react'

Error: Failed to load plugin prettier/react: Cannot find module 'eslint-plugin-prettier/react'
    at Function.Module._resolveFilename (module.js:538:15)
    at Function.resolve (internal/module.js:18:19)

What could be the problem, all dependencies are installed both globally and locally?
Already tried everything.
I will be grateful...

Answer 1

install eslint -plugin-react plugin . Optional if not installed:
Add like this:

{
  "extends": [
    "airbnb",
    "prettier",
    "prettier/react"
  ],
  "plugins": [
    "prettier"
  ],
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "env": {
    "browser": true,
    "node": true
  },
  "rules": {
    "no-plusplus": 0,
    "no-confusing-arrow": 0,
    "no-restricted-syntax": 0,
    "guard-for-in": 0,
    "class-methods-use-this": 0,
    "jsx-a11y/no-static-element-interactions": 0,
    "jsx-a11y/anchor-is-valid": 0,
    "react/no-danger": 0,
    "react/prop-types": 0,
    "react/jsx-filename-extension": 0,
    "react/jsx-curly-brace-presence": ["error", { "props": "never", "children": "never" }],
    "import/no-unresolved": ["error", { "commonjs": true }],
    "import/extensions": 0,
    "import/no-extraneous-dependencies": ["error", {"devDependencies": true}],
    "import/prefer-default-export": 0,
    "prettier/prettier": ["error", {
      "singleQuote": true,
      "trailingComma": "all"
    }]
  }
}

Customize the rules for yourself.
If you want to precommit the check, install lint-staged and husky , and add the following lines to package.json :

"scripts": {
    // ваши скрипты
    "precommit": "./node_modules/.bin/lint-staged",
  },
  "lint-staged": {
    "**/*.js": [
      "./node_modules/.bin/prettier --write",
      "./node_modules/.bin/eslint --fix",
      "./node_modules/.bin/stylelint './app/**/*.js'", // если используете  css in js
      "git add"
    ]
  },

Now, before each of your commits, the code will be put in order automatically if possible. And interrupt the commit with an error if the rules are violated.