【TypeScript】CircleCIで毎日Lintの結果をSlack通知して少しずつstrictにしていきたい

2 min read読了の目安(約2600字

背景

あるあるだと思うのですが、私がジョインしているプロジェクトは、立ち上げ当初はtsconfigをstrict: falseで始めてしまっていました。

プロジェクト規模が大きくなってきて、any型があったりつらくなってきたので、strict: trueにしていきたいのですが、600個近くLintのerrorやwarnがあるので、一気にやるのはしんどいです。

そこでアプローチとして、毎日深夜0時にLintを実行して、その結果をSlackに流してプロジェクトメンバー同士監視することで、strictな書き方を意識して少しずつ減らして行こうという形を取ることにしました。
(特定ブランチへのpushごとにやったり、差分のみLintして、増えている場合はCIを落とすというやり方もあると思いますが、今回はこの方法で)

コード

まず、lintを実行して結果をslackにpostするスクリプトを書きます。
CIRCLE_PROJECT_REPONAME などの環境変数は、CircleCIで設定します。

#!/bin/bash

# Lintの結果をSlackに通知します
result_text=$(yarn lint 2>/dev/null | grep "✖")  #  ✖があるのは結果行
slack_payload="
[
  {
    'type': 'header',
    'text': {
      'type': 'plain_text',
      'text': ':warning: Lint errors found.',
      'emoji': true
    }
  },
  {
    'type': 'section',
    'text': {
      'type': 'mrkdwn',
      'text': '${result_text}'
    }
  },
  {
    'type': 'section',
    'fields': [
      {
        'type': 'mrkdwn',
        'text': '*Repository*: ${CIRCLE_PROJECT_REPONAME}'
      },
      {
        'type': 'mrkdwn',
        'text': '*Branch*: ${CIRCLE_BRANCH}'
      }
    ]
  },
  {
    'type': 'actions',
    'elements': [
      {
        'type': 'button',
        'text': {
          'type': 'plain_text',
          'text': 'View Job'
        },
        'url': '${CIRCLE_BUILD_URL}'
      }
    ]
  }
]
"

echo ${slack_payload}

curl 'https://slack.com/api/chat.postMessage' \
  -X POST \
  --header "Authorization: Bearer ${SLACK_ACCESS_TOKEN}" \
  -d "channel=${SLACK_DEFAULT_CHANNEL}" \
  -d "text=${result_text}" \
  -d "blocks=${slack_payload}"

.circleci/config.ymlを以下のようにします。

  • jobs
  lint:
    <<: *defaults
    working_directory: ~/workspace
    steps:
      - checkout
      - attach_workspace:
          at: .
      - restore_cache:
          key: v1-dependencies-{{ checksum "yarn.lock" }}
      - run:
          name: Install dependencies
          command: yarn install
          working_directory: .
      - save_cache:
          key: v1-dependencies-{{ checksum "yarn.lock" }}
          paths:
            - node_modules
      - run:
          name: Send Lint Results
          command: sh .circleci/send_lint_result.sh; # スクリプトを実行する
  • workflows

nightryでjobをスケジュールすることができます。

  nightry:
    triggers:
      - schedule:
          cron: "0 15 * * *" # UTC
          filters:
            branches:
              only:
                - develop
    jobs:
      - lint

結果

といった感じで、毎日深夜にどれだけlintのエラーがあるのかを通知してくれます。

チーム内では、実装しながら少しずつstrictに近づけていきましょうと合意しておいて、一つの目安として通知をwatchするようにしておけば良いかなと思います。

この通知がどれだけ貢献していたのかはわからないですが、1ヶ月ほどで半分以下になりました。