После отключения правила eslint ругается prettier, как предотвартить?

Question

[700Hp]

Развернул проект с помощью vue create, указал eslint + prettier

.eslintrc.js

module.exports = {
  root: true,
  env: {
    node: true,
  },
  extends: [
    "plugin:vue/vue3-essential",
    "eslint:recommended",
    "plugin:prettier/recommended",
  ],
  parserOptions: {
    parser: "@babel/eslint-parser",
  },
  rules: {
    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
    semi: ["error", "never"],
  },
}

сделал файл .prettierrc.json

{
  "semi": false
}

Тем не менее ошибка не пропадает:


Использую webstorm. Может с его конфигурацией что-то связано?

Answer 1

[Aetae]

prettier - это одно, eslint - это другое, если у тебя prettier подключается через eslint, то настройки для него указываются скопом, условно так:

rules: {
    'prettier/prettier': ['warn', {
      semi: false,
      ...
      singleQuote: true,
      vueIndentScriptAndStyle: true,
      arrowParens: 'avoid',
      trailingComma: 'none',
      quoteProps: 'consistent',
    }],

Answer 2

[Alex Karo]

Сейчас prettier используется как часть eslint
Я бы порекомендовал эти шаги разделить:
1) Вместо "plugin:prettier/recommended" поставить "prettier" - это должно выключить свои правила линтера по стилизации.
2) Запускать prettier отдельно - можно это делать автоматически перед коммитом через husky или интегрировать в CI.
3) Настроить в веб шторм форматирование с использованием prettier. Он умеет подхватывать .prettierrc.json

Поправьте, если что-то забыл