Плагин ESLint Vue, показывающий ложные срабатывания для директивы vue / comment

Насколько я понимаю, после перехода с VueCLI на Vite я должен выполнить линтинг вручную; поправьте меня если я ошибаюсь. Поскольку я хочу только линтовать свои файлы .ts и .html (я разделяю их даже для компонентов), у меня есть этот скрипт в моем пакете json:

"lint": "eslint --ext .ts --ext .html src/"

Он обнаружил некоторые проблемы, такие как отсутствие :key в циклах, но он также показывает мне эту ошибку для каждого шаблона:

ошибка очистить vue / комментарий-директива

И это всегда закрывающий тег любых корневых элементов в моем template.html. Если есть только один корневой элемент, я получаю одно предупреждение для файла, если есть несколько корневых элементов, я получаю предупреждение для каждого закрывающего тега.

Я не понимаю, на что это правило жалуется, поскольку, согласно его документации, оно есть для комментариев eslint-disable, которых у меня нет в моих шаблонах.


person Thomas    schedule 25.10.2020    source источник
comment
Хо @ Томас, где ты в этом разобрался? Я получаю это сейчас после добавления плагина пряжи. Я попытался удалить плагин и переустановить проект, но ошибка все еще существует. Я нахожу на удивление очень мало вопросов по этому поводу. Спасибо!   -  person Doud    schedule 16.11.2020


Ответы (5)


У меня была такая же проблема, но в nuxt с eslint мне просто нужно было обновить eslint-config и eslint-module:

"@nuxtjs/eslint-config": "^5.0.0",
"@nuxtjs/eslint-module": "^3.0.1",

источник: https://github.com/nuxt/eslint-plugin-nuxt/issues/121

person Alexander Kim    schedule 26.11.2020
comment
Не забудьте также обновить eslint до ^7.22.0, иначе вы можете столкнуться с ошибками. - person FooBar; 26.04.2021

Я только что обновил свои зависимости npm, и у меня такая же ошибка.

Я читал документацию eslint и, наконец, понял, что вы можете удалить false error, если настроите правило в файле конфигурации .eslintrc.js.

это мой .eslintrc.js файл конфигурации:

module.exports = {
  root: true,
  env: {
    browser: true,
    node: true
  },
  parserOptions: {
    parser: 'babel-eslint'
  },
  extends: [
    '@nuxtjs',
    'prettier',
    'prettier/vue',
    'plugin:prettier/recommended',
    'plugin:nuxt/recommended'
  ],
  plugins: [
    'prettier'
  ],
  // add your custom rules here
  rules: {
    "vue/comment-directive": 0
  }
}

добавьте правило "vue/comment-directive": 0 и это !, сообщение об ошибке удалено !.

возможные значения:

  • 0 означает disabled
  • 1 означает warning
  • 2 означает error

Попробуйте изменить его в своей IDE на то, как он работает

(В моем случае мне приходилось останавливать сервер и повторно запускать его каждый раз, когда я менял значение в этом файле конфигурации.)

person Antonio Martin    schedule 20.11.2020
comment
но почему это происходит? Вы только что подавили эту ошибку. - person Alexander Kim; 26.11.2020
comment
Почему? eslintrc работает таким образом. Вы можете увидеть это в документации eslint ... - person Antonio Martin; 27.11.2020
comment
Линтеры сводят меня с ума. Я сделал то же самое и отключил ошибку, чтобы продолжить работу, но, как и @AlexanderKim, мне любопытно понять эту ошибку, поскольку ее раньше не было. - person Claire; 07.12.2020
comment
Это своего рода временное исправление. Потому что я не очень хочу отключать vue/comment-directive. Я использую комментарии eslint-disable в своих шаблонах ... - person Paul Melero; 21.12.2020


Установите этот фрагмент на .eslintrc.js

"vue/comment-directive": ["error", {
  "reportUnusedDisableDirectives": false
  }]

Решите мою проблему, мне интересно, почему. Решение из документации

Узел v12.20.0

person Yoarthur    schedule 28.11.2020

Это своего рода временное исправление, которое сработало для меня, и я думаю, что оно сработает и для вас.

vue / комментарий-директива

Это правило включено во все подключаемые модули: vue / base, plugin: vue / essential, plugin: vue / vue3-essential, plugin: vue / настоятельно рекомендуется, plugin: vue / vue3-strong-Recommended, plugin: vue / Recommended и плагин: vue / vue3-Recommended.

ESLint не предоставляет API для улучшения функциональности eslint-disable, а правила ESLint не могут влиять на другие правила. Но ESLint предоставляет API процессоров.

Это правило отправляет все комментарии, похожие на eslint-disable, как ошибки в пост-процесс обработчика файлов .vue, затем пост-процесс удаляет все ошибки vue / comment-directive и сообщения об ошибках в отключенных областях.

Все, что вам нужно сделать, это добавить eslint-disable-next-line vue / component-tags-order эту строку в качестве комментария выше везде, где вы используете комментарии внутри тегов в каждом блоке, который необходимо указать, добавляются ли комментарии. .

Для получения дополнительной информации посетите: - https://eslint.vuejs.org/rules/comment-directive.html

person Utkarsh_M021    schedule 26.05.2021