Как мне переключиться с eslint-config-prettier на prettier-eslint в существующем проекте Nuxt.js?

Я создал проект Nuxt.js с помощью create-nuxt-app и выбрал Typescript + Prettier + ESLint в качестве плагинов. Он сгенерировал рабочую конфигурацию, но использует пакет eslint-config-prettier, который не позволяет вам изменять ни одно из самоуверенных правил Prettier. Вместо этого я хотел бы использовать пакет prettier-eslint, чтобы можно было перезаписать некоторые из этих правил. К сожалению, я не уверен, какие пакеты мне нужно удалить, а какие добавить.

Это в моем текущем .eslintrc.js:

extends: [
    '@nuxtjs/eslint-config-typescript',
    'plugin:nuxt/recommended',
    'prettier'
],
plugins: []

И .prettierrc:

{
  "semi": false,
  "singleQuote": true
}

Расширение vs-code-prettier-eslint (для автоматического форматирования в VS Code) говорит, что для этого требуются следующие пакеты:

  • eslint
  • красивее
  • Prettier-Eslint
  • @ typescript-eslint / parser (для проектов TS)
  • vue-eslint-parser (для проектов Vue)

Я не знаю, нужны ли мне 2 дополнительных пакета, поскольку Nuxt уже поместил некоторые из своих расширений в конфигурацию ESLint.

Не могли бы вы предоставить мне необходимую конфигурацию ESLint (и конфигурацию Prettier, если требуется)?


person Susccy    schedule 22.07.2021    source источник
comment
Несколько дней назад я обнаружил небольшую ошибку с Prettier. Попробуйте следовать этому: github.com/nuxt/nuxt.js/issues/9563 Тогда вы сможете отредактировать .prettierrc по своему вкусу.   -  person kissu    schedule 22.07.2021
comment
Кроме того, предпочитайте не полагаться на расширение VScode, а, скорее, сохранять его независимым от инструментов, иначе говоря, Prettier-format через ESlint. Таким образом, всем в вашей команде нужен только ESlint, и они могут использовать любой редактор кода / IDE, который им нравится!   -  person kissu    schedule 22.07.2021
comment
@kissu у вас есть ссылка, как форматировать с Prettier через ESLint? Я не слышал об этом раньше.   -  person Susccy    schedule 22.07.2021
comment
Проблема, с которой я вас связал, заключается в правильном использовании этого параметра. Я форматирую свой код через VScode уже 3 года, никогда не устанавливал расширение Prettier, только ESlint. Вам нужны незначительные настройки (в вашем VScode), чтобы он работал.   -  person kissu    schedule 22.07.2021
comment
@kissu Извини, что не смог ответить раньше. Я прочитал вашу проблему Github и ваш образец репозитория, но, к сожалению, и то, и другое не совсем то, что мне нужно. Я не хочу, чтобы ошибки стиля кода выделялись eslint (который в настоящее время обрабатывается eslint-config-prettier), поскольку они все равно будут исправлены при сохранении Prettier. Я только хочу, чтобы eslint выделял плохие ошибки кода, такие как неиспользуемые вары. Единственная причина, по которой я хочу изменить свою настройку, заключается в том, что Prettier не имеет настройки для изменения стиля скобок для блоков if-else, что для меня неприемлемо.   -  person Susccy    schedule 26.07.2021


Ответы (2)


Помимо всех других комментариев, вы также можете проверить этот вопрос, где я объяснил и связал репозиторий Github: https://stackoverflow.com/a/68225547/8816585

С этими двумя вы можете добиться чего-то приличного, ИМО. Не уверен в настройке TS, но с точки зрения Prettier это не должно быть проблемой.

person kissu    schedule 22.07.2021

Я решил свою проблему не переключением на prettier-eslint, а установкой вместо него prettierx. Это менее самоуверенный форк Prettier с большим количеством вариантов настройки правил, которые точно соответствуют моим потребностям.

Моя конфигурация eslint осталась такой же, как показано в вопросе, и я продолжаю использовать eslint-config-prettier.

Мне пришлось добавить "prettier.prettierPath": "./node_modules/prettierx" в свой VS Code settings.json, чтобы расширение Prettier правильно использовало новую библиотеку.

person Susccy    schedule 26.07.2021