こちらの記事は カケハシ Advent Calendar 2022 の 8 日目の記事になります。
こんにちは。Musubi AI 在庫管理のフロントエンドの開発を担当している大村です。
私は普段の開発で Visual Studio Code (以下 VSCode) を使っています。 VSCode は非常に高機能なエディタで、開発に役立つ多くの機能が提供されており、その中には Git 関連の機能も含まれています。
私自身、以前は Git の CLI ツールを使っていましたが、VSCode の Git 機能を知るうちに利便性を感じることが増え、VSCode 上で操作することが多くなりました。
今回は私が便利だと感じた VSCode の Git 関連機能について紹介していきます。
この記事で紹介する内容
- (1) 選択した範囲をステージする
- (2) 直前のコミットに変更を追加する
- (3) 差分を確認する
- (4) GitHub 上でファイルを開く
- (5) コミットを並び替える
備考
- ⚠ (1)~(3) はデフォルトで使用できますが、(4)と(5)については拡張機能の GitLens を使用します。
- ⚠ VSCode と GitLens は下記のバージョンを使用しています。
- VSCode: 1.73.1 (Universal)
- GitLens: v13.1.1
(1) 選択した範囲をステージする
使い方
- ステージしたい行を選択する
- コマンドパレットから
Git: Stage Selected Ranges
を実行する
使い所
ある程度コードを書き進めた後、適切な粒度に分けてコミットしたい場面があります。
例えば、あるロジックを関数に切り出すような変更をした後の場面を想像してみます。 ここでそのままコミットすると「関数の作成」と「既存の処理の置き換え」が混ざった大きなコミットができてしまいます。
このような場合に、「関数の作成」部分のコードを Stage Selected Ranges
でステージしてコミットを分けることで、コミットを小さくまとめることができます。
これによって、コミット内での変更意図が明確になり、コードレビュー時にレビュアーのコストを下げることができます。
(2) 直前のコミットに変更を追加する
使い方
- 変更をステージする
- コマンドパレットから
Git: Commit Staged (Amend)
を実行する - コミットメッセージを確定する
使い所
コミットした後に、コメントを 1 行書き加えておけば良かった...などと思い出すケースがよく発生します。直前のコミットを一度リセットしても良いですが、少し手間がかかります。
この場合、後から思い出した追加の変更部分をステージし、Commit Staged (Amend)
を実行することで、直前のコミットの中に今の変更を加えることができます。
(1) で記載した内容を組み合わせることで、変更部分のステージングについても簡単に行うことができます。
(3) 差分を確認する
使い方
- ファイルに変更を加える
- コマンドパレットから
Git: Open Changes
を実行する
使い所
現在編集しているファイルと前回コミットとの差分を確認したい場合があります。
VSCode サイドバーのソース管理から同様の確認をすることは可能ですが、現在のファイルを選んで差分を開くという感じでひと手間かかってしまいます。
そこで、Git: Open Changes
を実行すると、現在編集中のファイルの差分をすぐに確認することができます。
また、差分が表示されている状態で Git: Open File
を実行すると、元の編集中のファイルに戻ることができます。こちらを合わせて活用することで、差分と元ファイルを素早く往復することができて便利です。
(4) GitHub 上でファイルを開く
使い方
- VSCode 上で共有したいファイルを開く
- コマンドパレットで
GitLens: Open File on Remote
を実行する
※ GitLens のインストールが必要です
使い所
開発メンバーに対して、コード上の特定の箇所を GitHub のリンクとして共有したい場面があります。
ブラウザから直接探す場合、目的のファイルに到達するまでに何度もリンクを辿っていく必要があり、少々大変です。
代わりに、VSCode で対象のファイルを検索して GitLens: Open File On Remote
を実行することで該当ファイルの GitHub のページを新規タブで開くことができます。
また、VSCode で行を選択した状態でコマンドを実行すると行が選択された状態で GitHub のファイルを開くことができます。
(5) コミットを並び替える
使い方
- コマンドパレットで
GitLens: Git Rebase...
を実行する (Git: Rebase Branch...
とは別) - 対象のリポジトリ, ブランチ, 開始点のコミットを選択する
Confirm Rebase
でInteractive Rebase
を選択する
※ GitLens のインストールが必要です
使い所
コミットをプッシュする前に、コミットを統合したり並び替えたりしたい場面があります。
その場合に GitLens: Git Rebase...
を実行することで、 GUI 上で interactive rebase を行うことができます。
Git CLI ツールの git rebase -i
でも同様の操作が可能ですが、直感的に操作できて便利です。
おわりに
機能の紹介は以上となります。
この記事を通して少しでも気付きがありましたら幸いです。
最後まで読んでくださりありがとうございました。