Tech

reviewdog/stylelintが動かない

  • このエントリーをはてなブックマークに追加

reviewdog便利です。
stylelint用のactionがあるので、設定してみたのですがStylelintでひっかかるコードをPushしても報告してくれません。

該当コードは以下のようになっています。

entrypoint.sh
if [ "${INPUT_REPORTER}" == 'github-pr-review' ]; then
  # Use jq and github-pr-review reporter to format result to include link to rule page.
  $(npm bin)/stylelint "${INPUT_STYLELINT_INPUT:-'**/*.css'}" --config="${INPUT_STYLELINT_CONFIG}" --ignore-pattern="${INPUT_STYLELINT_IGNORE}" -f json \
    | jq -r '.[] | {source: .source, warnings:.warnings[]} | "\(.source):\(.warnings.line):\(.warnings.column):\(.warnings.severity): \(.warnings.text) [\(.warnings.rule)](https://stylelint.io/user-guide/rules/\(.warnings.rule))"' \
    | reviewdog -efm="%f:%l:%c:%t%*[^:]: %m" -name="${INPUT_NAME:-stylelint}" -reporter=github-pr-review -level="${INPUT_LEVEL}" -filter-mode="${INPUT_FILTER_MODE}" -fail-on-error="${INPUT_FAIL_ON_ERROR}"
else
  $(npm bin)/stylelint "${INPUT_STYLELINT_INPUT:-'**/*.css'}" --config="${INPUT_STYLELINT_CONFIG}" --ignore-pattern="${INPUT_STYLELINT_IGNORE}" \
    | reviewdog -f="stylelint" -name="${INPUT_NAME:-stylelint}" -reporter="${INPUT_REPORTER:-github-pr-check}" -level="${INPUT_LEVEL}" -filter-mode="${INPUT_FILTER_MODE}" -fail-on-error="${INPUT_FAIL_ON_ERROR}"
fi

reporterにgithub-pr-reviewを設定した場合は動きますが、このモードはBotがレビュワーに入ってくるやつなのでgithub-or-checkを使いたい。そうすると、elseの方が実行されるわけですが、stylelintの結果をreviewdog -f=stylelint につなげても何も出力されません。
debugのためにteeオプションを付けると元の出力は表示されるので、Stylelint自体は動作しています。もしreviewdogも正しく処理されれば二重で表示されます。

npx stylelint "**/*.css" | reviewdog -f=stylelint -reporter=local -level=error -filter-mode=nofilter --tee

結論から言えば、--no-colorを指定する必要がありました。が、今のバージョンでは--no-colorを指定することができません。

npx stylelint "**/*.css" --no-color | reviewdog -f=stylelint -reporter=local -level=error -filter-mode=nofilter --tee

なので、このActionを使わずに、自分でLintを実行し、reviewdogにつなげる必要があります。

steps:
  - uses: actions/checkout@v2
    with:
      fetch-depth: 0
  - uses: actions/setup-node@v2
    with:
      node-version: '16'
      cache: npm
      cache-dependency-path: |
        package-lock.json
  - run: npm ci
  - uses: reviewdog/action-setup@v1
  - run: reviewdog -version
  - name: stylelint
    env:
      # reviewdogはこの環境変数でTokenを参照する
      REVIEWDOG_GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }}
    run: |
      npx stylelint "**/*.css" --no-color \
        | reviewdog -f="stylelint" -name="stylelint" -reporter="github-pr-check" -level="error" -filter-mode="nofilter" -fail-on-error="false"

これでreviewdogがannotationを付けたりと正しく報告してくれるようになりました。
※reviewdogのオプションは必要に応じて変更してください。

参考情報