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

Lintでレビューをラクにしよう/ Easing Code Review with Lint for TypeScript

Lintでレビューをラクにしよう/ Easing Code Review with Lint for TypeScript

名古屋フロントエンドユーザーグループ TypeScript勉強会 での発表です。
https://nfug.connpass.com/event/123497/

TATSUNO Yasuhiro

April 03, 2019
Tweet

More Decks by TATSUNO Yasuhiro

Other Decks in Programming

Transcript

  1. 色々な言語で使える Lint JavaScript: ESLint TypeScript: ESLint, TSLint CSS/altCSS: Stylelint HTML:

    htmllint, tidy Markdown: markdownlint Ruby: RuboCop PHP: phplint, PHP_CodeSniffer Python: Pylint, Pycodestyle Java: Checkstyle, SpotBugs Scala: Scalafix
  2. ESLint/TSLint で 見つけられる問題の例 ESLint: no-await-in-loop ルール ループ内の非効率かもしれない await を発見。非同期処理のレビューがラクに ESLint:

    no-cond-assign ルール if (foo.bar = ‘message’”) を発見。たまにやらかす… TSLint: no-unsafe-any ルール any型での雑なメンバーアクセス、ダメ絶対。ちゃんとキャストかジェネリクス使って!!
  3. とある OSS に ESLint 導入→バグ発見 rules: function (field, rules) {

    if (Array.isArray(field)) { $.each(fields, function (index, field) { module.remove.rule(field, rules); }); } else { module.remove.rule(field, rules); } 数年物のバグ、あなたはレビューで見つけられますか? テストがないのが問題だけど
  4. まとめ 退屈なレビューは Lint に任せて、本質的な レビューに集中しよう! TypeScript では TSLint がデファクトだけど JS

    にも対応した ESLint もいいよ! Lint の設定は、よく練られたデファクトに 乗っかるとラクだよ!