O hirunewani blog

ESLintでエラーが出ているルールをjqを利用してリスト表示する

Created at

ESLintのあるプラグインを更新する際にエラーが出ているルールの一覧が欲しいという話があったので、jqを利用してエラーが出ているルールをリスト表示する方法を考えた。

ESLintの結果をJSON形式で出力する

ESLintは--format jsonオプションを利用することで、実行結果をJSON形式で出力できる。

eslint . --format json

次のような出力が得られる。

[
  {
    "filePath": "source-file-0.ts",
    // ...
    "errorCount": 2,
    // ...
  }
  {
    "filePath": "source-file-1.ts",
    "messages": [
      {
        "ruleId": "unused-imports/no-unused-vars",
        "severity": 2,
        "message": "'hoge' is defined but never used. Allowed unused args must match /^_/u.",
        "line": 8,
        "column": 31,
        "nodeType": null,
        "messageId": "unusedVar",
        "endLine": 8,
        "endColumn": 35,
      },
      {
        "ruleId": "unused-imports/no-unused-vars",
        // ...
      },
    ],
    "suppressedMessages": [
      {
        "ruleId": "unused-imports/no-unused-imports",
        "severity": 2,
        "message": "'React' is defined but never used.",
        "line": 2,
        "column": 8,
        "nodeType": null,
        "messageId": "unusedVar",
        "endLine": 2,
        "endColumn": 13,
        "fix": {
          "range": [67, 74],
          "text": "",
        },
        "suppressions": [
          {
            "kind": "directive",
            "justification": "",
          },
        ],
      },
      {
        "ruleId": "unused-imports/no-unused-imports",
        // ...
      },
    ],
    "errorCount": 2,
    "fatalErrorCount": 0,
    "warningCount": 0,
    "fixableErrorCount": 0,
    "fixableWarningCount": 0,
    "source": "// eslint-disable-next-line unused-imports/no-unused-imports\nimport React, { useState } from \"react\";\n\ninterface MyComponentProps {\n  hoge?: string;\n}\n\nexport const MyComponent = ({ hoge }: MyComponentProps) => {\n  return \"Hello, World\";\n};\n\nexport const MyComponent2 = ({ hoge, ...props }: MyComponentProps) => {\n  return props;\n};\n\nexport const MyComponent3 = ({ hoge: _hoge, ...props }: MyComponentProps) => {\n  return props;\n};\n\n// eslint-disable-next-line unused-imports/no-unused-vars\n(function (foo, bar, baz, qux) {\n  return bar;\n})();\n\n(function (foo, bar, baz, qux) {\n  return qux;\n})();\n",
    "usedDeprecatedRules": [],
  },
]

jqを利用してESLintのJSONからruleIdを抽出する

ESLintのJSON出力を見ると、ソースファイル毎にエラーが出ていればerrorCountがインクリメントされ、 messagesでその内容を確認できることが分かる。またメッセージがerrorかwarningかはseverityで表現されている。 よって次のようにすれば、エラーを取得できる。

eslint . --format json | jq -r 'map(select(.errorCount > 0).messages[] | select(.severity == 2).ruleId ) | unique'

次のような結果が得られる。

[
"unused-imports/no-unused-imports",
"unused-imports/no-unused-vars"
]