【ESLint】 GitHub Actions で reviewdog (run ESLint) を飼う 🐶
はじめに
こんにちは、エンジニアのがんがんです。
皆さんは reviewdog を飼っていますか?
reviewdog を用いることでリンターによる静的解析結果をプルリクエストのコメント上に表示することができます。プルリクエストにコメントが残るため、ログとしての効果もあります。
弊社では GitHub Actions 上で ESLint を利用する際に reviewdog/action-eslint アクションを利用しています。
GitHub Actions を用いて reviewdog + ESLint を動作させている記事には見かけますが reviewdog/action-eslint を用いた記事はあまり見かけません。
そこで本記事では reviewdog/action-eslint を GitHub Actions で実行していきます。
reviewdog の設定方法
reviewdog を利用する場合、以下の2つの方法が考えられます。
- reviewdog をCLI or npm scriptsで実行する
- reviewdog が提供する action-lint Actionsを利用する
選択肢1は他の記事でよく見かけますが選択肢2はほとんど見たことがありません。
ESLint、RuboCop、golangci-lintなどは公式から提供されているアクションを利用することでメンテコストを下げることが出来ます。
reviewdog/action-eslint ワークフローを利用する
name: Lint
on:
pull_request:
branches:
- main
paths-ignore:
- '*.md'
- '.vscode/**'
jobs:
lint:
runs-on: ubuntu-24.04
timeout-minutes: 3
permissions:
contents: read
pull-requests: write
strategy:
matrix:
env: [src]
steps:
- uses: actions/checkout@v4
- run: corepack enable
- uses: actions/setup-node@v4
with:
node-version-file: 'package.json'
cache: 'pnpm'
- run: pnpm i --frozen-lockfile
- uses: reviewdog/action-setup@v1
with:
reviewdog_version: latest
# 本記事のメイン
- name: Run reviewdog with eslint
uses: reviewdog/action-eslint@v1
with:
github_token: ${{ secrets.GITHUB_TOKEN }}
filter_mode: diff_context
fail_level: error
workdir: ${{ matrix.env }}
実行結果
以下は eslint-plugin-vue が未使用変数に対する指摘を表示したケースです。reported by reviewdog 🐶
があることでリンターによる指摘であることがよく分かります。
おわりに
今回は reviewdog/action-eslint アクションを利用して GitHub Actions + reviewdog の記事を書きました。
近年では autofix-ci、PR-Agent、CodeRabbit など数々の手法が登場しています。AIレビュー、PR自動生成、機械的レビューなど、それぞれの手法に対して一長一短があります。
reviewdog はリンターによる静的解析結果をコメント表示するため非常に導入が簡単です。
reviewdog を設定することでレビュアーが1人増えたような感覚でレビューが捗ります。
Python 環境ではreviewdog + Ruffを導入しており、Python 環境についてもどこかで記事を執筆したいと思います。
Discussion