Help us understand the problem. What is going on with this article?

VSCodeでgit add -p を快適に行う

git add -p 便利ですよね。ファイルの変更箇所の一部だけをコミットしたいときによく使います。
ですが、自分はコマンドラインで git add -p する操作がどうにも慣れず、億劫に感じていました。
そこで Visual Studio Code の機能を使えばもっと直感的で快適に git add -p ができることを知りましたので紹介したいと思います。

動作イメージ

こんな感じで快適にできるよっていうイメージを伝えるためにgifを作ってみました。
このサンプルは3行の変更があるときに、git add -p を利用して「1行目をコミット」してから「2,3行目をコミット」する例です。

gitaddp3_trimmed.gif

git add -p する手順としては下記になります。

  • addしたい箇所を選択する。
    • addする変更箇所が1行の場合はその行にカーソルがあればOK(↑の例でいう「1行目を変更」のコミットのやり方)
    • 複数行の場合はマウスとかで複数行を選択します(↑の例でいう「2,3行目を変更」のコミットのやり方)
  • 設定したショートカットキー(後述)を押すと選択箇所だけがaddされる
    • 設定方法は後述しますが、設定したショートカットキーを押すだけでaddされます。便利!
  • あとは普通にコミットするだけ

設定方法

設定方法を解説します。

Visual Studio Code のショートカットを設定する画面を開く

まず、Cmd-Shift-p を押してコマンドパレットを開いて、shortcutと打つと、「キーボードショートカットを開く」という候補が補完されるので開きます。
image.png

「選択した範囲をステージする」コマンドにショートカットを割り当てる

git.stageSelectedRangesと入力すると「選択した範囲をステージする」コマンドが見つかります。
このコマンドを実行すると選択範囲をaddできます。
何も設定していないとキーバインドが空になっています。空になっているところをクリックするとキーバインドを入力するポップアップが出てくるのでそこで自分の好きなキーバインドを入力してください。あとはEnterを押せば設定完了です。

image.png

自分の場合は Ctl-z に割り当てています。(左手だけで楽に打てるので)
正しく設定されたら下記の感じの画面になります。
image.png

「選択した範囲をアンステージする」コマンドにショートカットを割り当てる

では今度は選択範囲をアンステージするコマンドにショートカットを割り当てます。間違えて add したのを取り消すときに使います。

基本は↑と同様ですが、今度は git.unstageSelectedRanges コマンドに対して割り当ててください。
image.png

自分の場合は Ctl-x に割り当てています。(同じく左手だけで楽に打てるので)
正しく設定されたら下記の感じの画面になります。
image.png

以上になります。
もし良さそうだと感じたら、参考にしていただけると幸いです。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away