🐻
GitHub で Flutter のコードの差分を見やすくする
こんにちは。やまたつです。
Flutter のコードレビューをするときに Padding を追加しただけなのに、大量の差分が出てどこの変更か分かりずらい時はありませんか？
GitHub にはインデントやスペースによるズレの変更は表示しない方法があるので紹介します。
Before
After
いかがでしょうか。
どちらも Padding を追加しただけですが、 After の方が差分がわかりやすくなっていると思います。
適用方法
手動で適用
- 歯車マークをクリック
-
Hide whitespaceにチェックを入れる
もしくは、URL の末尾に ?w=1 を追加すると同様のことができます。
- 適用なし URL
- 適用あり URL
自動で適用(※ chrome 環境のみ)
（他の環境にも同じような extension があると思いますが、私は chrome しか使わないので chrome のみの紹介とさせていただきます🙏）
- chrome extension の GitHub Whitespace を追加する
- GitHub のレビューページを開くと勝手に適用される
仕組み的には URL の末尾に?w=1が自動で追加されるようです。
※自動で適用の注意点
Python のようにインデントがコードに直接影響が出るような環境ではこの extension は向いていないと思います。
また、Flutter でもインデントのズレに気付きにくくなる可能性が高くなるので CI などで検知できる仕組みを導入しておくと良いと思います。
おわりに
快適な Flutter のコードレビューライフを送りましょう！
Discussion