コミット前に Lintチェックしませんか？

npmモジュールを用いて
ESLint(eslint --fix) / Rubocop(rubocop -a)といったコマンドを
コミット前に実行するための方法を紹介

#1 クーコム Tech Meetup 代官山でLT会（初心者歓迎）
https://coocom.connpass.com/event/138471/

Transcript

1. コミット前に Lintチェックしませんか？ #1 クーコム Tech Meetup 代官山でLT会 2019/07/31(水) 矢崎 祐樹 / ざき / @zucky_zakizaki
2. ざき （やざき ゆうき） @zucky_zakizaki • 株式会社ランチェスター • Ruby / Vue.js • TypeScriptに興味がある • ブログ好き - はてなブログ - note
3. みなさん Lintチェックしてますか？
4. Rubocop (rubocop -a) ESLint / JSLint
5. コミット前に Lint走らせるの 忘れちゃう
6. 仕組みで解決 しちゃいましょう！
7. 1. husky - git commit時に発生する
 Gitフック「pre-commit」をhuskyでハンドリング 2. lint-staged - Gitのステージに上がっているファイルを対象に
 eslint等のコマンドを実行できる npmモジュールの紹介
8. package.jsonの設定（eslintの場合）
9. package.jsonの設定（eslintの場合） huskyでpre-commit検知、 lint-stagedへハンドリング jsファイルに対して、 eslint＆自動修正実行 自動修正されたjsファイルを git add で再度ステージへ 対象外のファイルを指定
10. 実行例（eslintの場合）
11. huskyでpre-commit検知 package.jsonに記載した コマンド実行 実行例（eslintの場合）
12. 1. CI環境がない場合 - 各開発者の環境下にて、
 Lintやテストし忘れた状態でコミット＆Pushする
 という事故を防げる - 「個人開発、CIメンテ時の代替」として使える 2. コミット数を減らしたい場合 - 「CIにてLintNG→コミット→Push」
 というサイクルによる無駄なコミットを防げる メリット・使える場面
13. 細かい手順はこちら 参考記事 - コミット前に Lint を強制するなら lint-staged が便利 - husky + lint-stagedでgitのprecommit時にimageminを行い、 minifyした画像のみコミットされるようにする - 【JavaScript】コミットする前にlint-stagedでeslintのチェックを する - 【Ruby】コミットする前に husky+lint-staged で、Rubocopの自 動整形＆チェックを行う
14. coocom