@cester

Почему ошибка при установке prettier?

Добрый день! Объясните пожалуйста почему при установке prettier, eslint-plugin-prettier webstorm материться что
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)


В чем может быть проблема, все зависимости установлены как глобально так и локально?
Уже все перепробовал.
Буду благодарен...
  • Вопрос задан
  • 197 просмотров
Решения вопроса 1
rockon404
@rockon404
Frontend Developer
ставьте плагин eslint-plugin-react. Дополнительно если не установлены:
eslint
babel-eslint
eslint-plugin-jsx-a11y
eslint-plugin-import
eslint-config-prettier
eslint-config-airbnb
eslint-plugin-prettier
Добавляйте так:
{
  "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"
    }]
  }
}


Правила настройте под себя.

Если хотите precommit проверку, то поставьте lint-stаged и husky, и добавьте следующие строки в 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"
    ]
  },

Теперь перед каждым вашим коммитом код будет приводиться в порядок на автомате если это возможно. И прерывать коммит ошибкой если нарушены правила.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Biganto Москва
от 130 000 до 130 000 руб.
от 2 500 до 4 000 usd.
HTML Academy Москва
от 85 000 до 100 000 руб.
15 авг. 2018, в 18:50
750 руб./в час
15 авг. 2018, в 18:48
45000 руб./за проект
15 авг. 2018, в 18:14
800 руб./за проект