S.Kudoをフォローする

VSCodeでGitを扱う

開発環境・ツール

Gitにはだいぶ慣れてきました。
イレギュラー(間違ってCommit等)がなければちゃんと使い慣れている風に出来ます!
今回は使い慣れていたSourcetreeがとある事情で使えなくなった時があり、その時にGitで四苦八苦しVSCodeで賄って?いた時の作業をまとめました。

VSCodeでのGit操作

VSCodeは多機能です。また、更には様々な拡張機能があります。
ですが、拡張機能を入れなくてもいろいろと出来ることがあります。

ブランチ切り替え

VSCodeの左下にブランチ名が記載されています。
そこをクリックすることでブランチの作成や切り替えが簡単に行えます。
ブランチ切り替え後は切り替えたブランチ名が表示されるので確認しましょう。

下記と同義です

$ git branch
  feature/addVariable
  feature/displayMessage
* master

$ git checkout feature/displayMessage
Switched to branch 'feature/displayMessage'

$ git branch
  feature/addVariable
* feature/displayMessage
  master

ステージングとコミット

ワークツリーでの変更をインデックスへ登録し、ローカルリポジトリへのCommitもVSCode内で完結できます。
変更されたソースは左メニューのGitのフロー図っぽいアイコンをクリックすることで表示される「ソース管理」に表示されます。
ステージするためには「+」ボタンをクリックします。

下記と同義です。

$ git add TesPage.php

$ git status
On branch feature/displayMessage
Changes to be committed:
  (use "git restore --staged <file>..." to unstage)
        modified:   TesPage.php

$ git commit --m=phpworld
[feature/displayMessage 3ede5c6] phpworld
 1 file changed, 1 insertion(+), 1 deletion(-)

拡張機能

拡張機能にはいろいろ便利なものがあります。
Git History等が有名だと思いますが、せっかく職場の方に紹介いただいたのでGit Graphを今回入れてみました。
綺麗で見やすいです!

こちらで他にもGitを操作することができ、マージも行えます。

他にもCherry PickやRevertについてコミットIDをわざわざ入力せずクリックだけでできるので楽です。

まとめ

今回は簡単にできるVSCodeでのGit操作を紹介しました。
他にもいろいろな拡張機能があり、便利に使うことができます。
Sourcetree使わなくていいかな・・・までいけそうですが、最近はあまり開発していません。
なのでいろいろ忘れます。
ちゃんと忘れないようにチェックは必要ですね。
特にうっかり別ブランチでの修正とCommit。
VSCodeの左下はちゃんと確認するようになりました。

それでは皆様ご安全に!