"BOKU"のITな日常

還暦越えの文系システムエンジニアの”BOKU”は新しいことが大好きです。

VisualStudioCode(VSCode)のGit機能とGitLensの使い方/自己流チュートリアル(4)

VisualStudioCode(VSCode)は、Gitに標準で対応しているみたいです。

こちらの使い方もいちおう把握しておこうと思います。

f:id:arakan_no_boku:20190811144704p:plain

 

今回の記事の前提

 

少なくとも。

Git for windows がインストールされていて、GitHubからクローンするなりして、既にGitのリポジトリがある前提です。

練習でもない限り、リポジトリを初期化するにせよ、クローンするにせよ、VSCodeからGit操作するより、GitBashとかでささっと作業した方が速いですから、現実に使わないことはやめときます。

インストールとGitHub等の初期設定はこちら。

arakan-pgm-ai.hatenablog.com

ブランチ運用や基本コマンド等についてはこちら。

を参照ください。

 

VSCodeはデフォルトでGit対応です

 

VsCodeはデフォルトでGitに対応してます。

f:id:arakan_no_boku:20190821214619p:plain

上記の白枠のアイコンが「Git」です。

最初は、選んでも「ソース管理プロバイダーが登録されていません」となってます。

でも、大丈夫。

メニューの「フォルダを開く」で、リポジトリフォルダを指定して開くと、勝手に認識して、以下のような画面になります。

f:id:arakan_no_boku:20190821215715p:plain

CHANGESが「0」なのは、実際にコミットが必要な変更がないからです。

上部の「...」を押すと以下のようなメニューが表示されます。

f:id:arakan_no_boku:20190821220043p:plain

 

ブランチを選択する

 

ここで注意しないといけないことがあります。

この時点でのブランチはデフォルトの「master」を指しています。

でも、masterには開発中はコミットしません。

前提にしている「branching model」では、masterは原則、リリース後の「本番環境」という想定だからです。

arakan-pgm-ai.hatenablog.com

開発作業は開発用の機能ブランチ(例:feature-xxxx)で作業する必要があります。

まず、画面の左下のステータスバーをみます。

f:id:arakan_no_boku:20190822233719p:plain

上記のようになっていれば、今は「feature-test」ブランチがカレントになってます。

ここが「master」とか「develop」とか作業用でないものなら、切り替えます。

f:id:arakan_no_boku:20190822234056p:plain

メニューから「チェックアウト先」を選ぶと、以下のような画面が表示されます。

f:id:arakan_no_boku:20190822233934p:plain

ここで切り替えたいブランチを選ぶ。

または「create new branch from...」を選んで、作業ブランチを作成します。

選ぶと最初にブランチ名の入力が求められるので、「feature-・・・」など、任意のブランチ名を入力します。

Enterを押すと、今度は「元にするブランチ」を選択するように求められます。

標準ブランチ運用に沿ってやるなら、普通は「develop」か「origin/develop」ですね。

とにかく。

大切なのは、自分が今どこのブランチで作業をしているか?を常に意識して、くれぐれも間違って「master」や「develop」にダイレクトにコミットしてしまうようなことがないようにすることです。

このへん・・もう少し、ミスしないようにツールがカバーしてくれるといいな・・と思うのですが、まあ、仕方ないですね。

 

試しに何か変更してみます

 

ひとつファイルを変更し、ひとつ新規につくってみました。

そうすると自動的に、変更が検知されて表示されてます。

f:id:arakan_no_boku:20190821222730p:plain

おっと。

ViSCodeの設定ファイル「setting.json」がCHANGESに表示されています。

PEP8のチェックを追加したので、設定ファイルも更新されたみたいです。

これはバージョン管理に含めたくありません。

そんな時は、リポジトリのフォルダ直下に「.gitignore」というファイルを置いて除外設定をします。

今回は、「.vscode」というフォルダ以下をすべて無視したいわけです。

そんな時は、以下のような内容で作ります。

.gitignore

.vscode/

このように最後に「/」を付ければ、そのフォルダ以下すべてを無視します。

f:id:arakan_no_boku:20190824134532p:plain

これで.vscode以下のファイルが変更対象からはずれました。

さて。

CHANGESのところに「+」ボタンが選択できるようになっています。

マウスをあてると「すべての変更をステージ」とあります。

f:id:arakan_no_boku:20190821223103p:plain

変更をステージというのは、追加(Add)、削除(rm)、リネーム(mv)などしたファイルをコミットの対象として指定することです。

つまり。

これらの変更をリポジトリにコミットするには・・。

  1. すべての変更をステージ
  2. すべてコミット→コミットメッセージの入力

という操作をすることになります。

うまくコミットできれば、CHANGESが「0」に戻ります。

正直な話。

VSCode上でソースの修正・テストをしながら、これ以上のGit操作をするのかな?と個人的には思っていて、ブランチ切ったり、マージしたり、リモートにプッシュしたりは、GitBashでやるほうが速いし迷わなくて良いくらいに思ってます(笑)

 

GitLensというのが良いらしいので試す

 

なのですが。

なにやら、拡張機能でGitLensというのが評判が良いのですね。

それだけ、インストールして試してみたいなと思います。

f:id:arakan_no_boku:20190821224510p:plain

インストールできるとこんなアイコンが追加されます。

f:id:arakan_no_boku:20190821224844p:plain

それを選ぶと、左ペインに、リポジトリやヒストリなどのリストが表示されます。

f:id:arakan_no_boku:20190824134907p:plain
そこで、確認したいファイルを選ぶと以下のように2つのウインドウで、変更前(左側)と変更後(右側)を並べて見せてくれます。

f:id:arakan_no_boku:20190821224806p:plain

上記の画像だと小さすぎてわかりづらいですが、実にわかりやすいです。

評判が良いのは当然です。

ということで。

これはアリですね。

今回は、こんなところで。

ではでは。