eslint は、vue もあるプロジェクトの *.ts ファイルを JavaScript として扱います

Question

typescript と vue を使用して Web プロジェクトを開発しています。 typescript-eslint と eslint-plugin-vue のドキュメントを読んだ後、次の eslint 設定を解決しました。

module.exports = {
  ルート: true、
  環境: {
    ブラウザ: true、
    es2021: 本当、
  }、
  拡張します: [
    "eslint: 推奨"、
    "プラグイン:vue/vue3-essential"、
    "プラグイン:@typescript-eslint/推奨"、
    "plugin:@typescript-eslint/recommended-requiring-type-checking",
    「もっときれいに」、
  ]、
  パーサー: "vue-eslint-parser",
  パーサーオプション: {
    パーサー: "@typescript-eslint/parser",
    プロジェクト: ["./tsconfig.json"]、
    tsconfigRootDir: __ディレクトリ名,
    extraFileExtensions: [".vue"]、
  }、
  オーバーライド: []、
  パーサーオプション: {
    ecmaVersion: "最新",
    ソースタイプ: "モジュール"、
  }、
  プラグイン: ["vue"、"@typescript-eslint"]、
};

vue ファイルは正しく解析されていますが、ts ファイルには不当な lint エラーが発生します。 JavaScriptの構文をチェックしているようです。以下に示すように:

parserOptions を削除し、パーサーを @typescript-eslint/parser に変更すると、ts ファイルは正しく lint しますが、vue ファイルの lint は壊れます。 。

誰か知っていますか？

Answer 1

私の知る限り、選択肢は 2 つあります:

1. パーサー: "vue-eslint-parser" を @typescript-eslint/parser

   に変更します。

2. .ts ファイルのオーバーライドを追加し、パーサーを @typescript-eslint/parser

   に設定します。

Answer 2

疲れすぎているのか、年をとりすぎているのでしょう。とにかく、問題は、同じ lint ファイル内に 2 つの parserOptions セクションがあることです。これが最終動作バージョンです:

リーリー