Upgrade to Pro — share decks privately, control downloads, hide ads and more …

【CircleCI】TypeScriptのLint結果を定期的にSlack通知することで少しずつ型安全になっていく様を眺めていく

 【CircleCI】TypeScriptのLint結果を定期的にSlack通知することで少しずつ型安全になっていく様を眺めていく

【オンライン】【テスト・新機能LT大会編】CircleCI コミュニティミートアップ の登壇資料です

https://circleci.connpass.com/event/211477/

Yuto Tachibana

May 20, 2021
Tweet

Other Decks in Programming

Transcript

  1. About me @tachibanayu24 たちばな ゆうと(@tachibanayu24) • 💻 オンボーディング支援の HRサービス Onnでテックリード

    • 💚 TypeScript/React/Goなどが好き • 🤔 PS5買えたものの下手すぎて最近起動してない
  2. TL;DR • 😇 今の会社にジョインしたとき、 TSの設定が strict: false だった • 🤔

    Lintエラーを減らしたいがリリースして間もないのでどんどん新規開発しなければならない • 💡 一気に修正するのはきついので、毎日残りエラー数を Slackにpostして意識付けしていく • 👏 2ヶ月半で80%のLintエラーは修正できた @tachibanayu24 👇 Zennにも書いてます 【TypeScript】CircleCIで毎日Lintの結果をSlack通知して少しずつstrictにしていきたい https://zenn.dev/tachibanayu24/articles/fd5ea1cb021f3a 撮影・シェアOKです 󰢏 後ほどスライドはアップロードして Tweetします
  3. strict: true TypeScriptでStrict Checksをすべて有効化する デフォルトではtrue 当然trueが推奨される 放置すると保守性が低く、危ないコードになっていく。。 noImplicitAny / noImplicitThis

    暗黙のanyや、それを持つthisを許可しない alwaysStrict use strictにしてくれる strictNullChecks nullとundefinedを区別する @tachibanayu24 strict: trueにすることで設定されるオプションの一例 (これ以外もあるよ! )
  4. Approach codebase scheduled task POST checkout Lint Report result やったことは非常にシンプル

    1. 深夜0時にGitHubからcheckoutしてくる 2. eslintを実行する 3. 結果をSlackに流す @tachibanayu24
  5. Code #!/bin/bash # Lintの結果をSlackに通知します result_text=$(yarn lint 2>/dev/null | grep "✖")

    # ✖があるのは結果行 slack_payload=" [ { … }, { 'type': 'section', 'text': { 'type': 'mrkdwn', 'text': '${result_text}' } }, { … }, { … }, ] " 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}" - run: name: Send Lint Results command: sh .circleci/send_lint_result.sh; nightry: triggers: - schedule: cron: "0 15 * * *" # UTC filters: branches: only: - develop jobs: - lint jobをスケジュールして checkoutや依存関係のインストール後にshellを実行するようにして 実行結果 を取得してSlackAPIを叩くだけ @tachibanayu24
  6. Result • 2/26: 603個 -> 5/20: 117個 まで減った 👏 •

    残り50個とかになったらあとは一気に lint errorを潰してTSの設定を変える予定 @tachibanayu24