Дилемма ESLint Определена, но никогда не использовалась VS Не удается найти имя при использовании импорта для набора текста

Я только что столкнулся с дилеммой линтинга, и мне нужна ваша помощь, чтобы знать, что нужно делать. я использую

$ yarn lint -v
yarn run v1.22.4
$ eslint . -v
v6.8.0

С плагинами vue и @typescript-eslint, и у меня это в файле .ts:

import Vue, { VNode } from 'vue';

export default Vue.extend ({
  render(createElement): VNode {
    return createElement('div',
      {},
      'Simple reproducible example'
    );
  }
});

Я получаю сообщение об ошибке:

 error  in ./src/components/Demo.ts

Module Error (from ./node_modules/eslint-loader/index.js):

/full/path/to/src/components/Demo.ts
  1:15  error  'VNode' is defined but never used  no-unused-vars

И веб-приложение, обслуживаемое yarn serve (vue-cli), показывает ту же ошибку, что делает его неотразимым. Использование импорта в typehint, похоже, не считается "использованием". Итак, я просто удалил импорт, но затем у меня есть эта ошибка:

ERROR in /full/path/to/src/components/Demo.ts(302,26):
4:26 Cannot find name 'VNode'.
    2 | 
    3 | export default Vue.extend ({
  > 4 |   render(createElement): VNode {
      |                          ^
    5 |     return createElement('div',
    6 |       {},
    7 |       'Simple reproducible example'

Что почему-то кажется лучше, потому что, по крайней мере, я могу перемещаться по веб-приложению, обслуживаемому yarn serve. Есть идеи, как правильно справиться с этой ошибкой?

РЕДАКТИРОВАТЬ: .eslintrc.js содержимое файла

module.exports = {
  'env': {
    'browser': true,
    'es6': true,
    'node': true
  },
  'extends': [
    'eslint:recommended',
    'plugin:vue/essential',
    'plugin:@typescript-eslint/eslint-recommended'
  ],
  'globals': {
    'Atomics': 'readonly',
    'SharedArrayBuffer': 'readonly'
  },
  'parserOptions': {
    'ecmaVersion': 2018,
    'parser': '@typescript-eslint/parser',
    'sourceType': 'module'
  },
  'plugins': [
    'vue',
    '@typescript-eslint'
  ],
  'rules': {
    'indent': [
      'error',
      2
    ],
    'linebreak-style': [
      'error',
      'unix'
    ],
    'quotes': [
      'error',
      'single'
    ],
    'semi': [
      'error',
      'always'
    ]
  }
};

person Ki Jéy    schedule 20.03.2020    source источник
comment
На этот вопрос ответили здесь   -  person Gamliel Cohen    schedule 06.04.2020


Ответы (1)


Обязательно настройте синтаксический анализатор для eslint на использование @typescript-eslint/parser вместо espree. Typescript анализируется иначе, чем простой Javascript, и не все правила lint, применимые к коду, написанному на Javascript, применимы к такому в Typescript.

Конфигурация раздела @ Проект typescript-eslint / typescript-eslint предоставляет образец .eslintrc.js файла, с которого вы можете начать.

Вы можете расширить эту конфигурацию с помощью плагинов для vue.

module.exports = {
  root: true,
  parser: '@typescript-eslint/parser',
  plugins: [
    '@typescript-eslint',
  ],
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/eslint-recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:vue/recommended',
    '@vue/standard',
    '@vue/typescript'
  ],
};
person Oluwafemi Sule    schedule 23.03.2020
comment
Как я уже сказал, у меня уже установлены плагины typescript-eslint и vue. Я обновлю свой вопрос, чтобы добавить файл eslintrc - person Ki Jéy; 27.03.2020
comment
Вы используете vue-cli в своем проекте? - person Oluwafemi Sule; 30.03.2020
comment
да. Я очень признателен за вашу помощь, не могли бы вы попробовать воспроизводимый пример? - person Ki Jéy; 01.04.2020