Visual Studio CodeをGitと連携する方法

作成:2019.12.03 02:00 更新:2021-11-13T00:14:47Z

用語

ここでは、Visual Studio Code(VSCode)とGitを連携させる方法を記載します。

Gitはバージョン管理ツールや構成管理ツールなどと呼ばれるものです。ソフトウェアを開発する上で構成管理はとっても重要です。いつ誰がどういった修正を入れたか、いつでも履歴を追えるようになっていることは、とても重要です。Gitはそのためのツールです。

VSCodeはGitと連携することで、VSCode上からコミットしたりプッシュしたりすることができます。

用語
環境
環境構築
リポジトリの作成と設定
リモートリポジトリへプッシュする
エラー時の対処方法
- プッシュ時に「リポジトリには、プッシュ先として構成されているリモートがありません。」というエラーメッセージが表示される。
- プッシュ時に「remote: error: GH007: Your push would publish a private email address.」のエラーが出た場合
オススメの書籍
- 独習Git

用語

バージョン管理でよく出てくる用語集です。バージョン管理になじみのないとなれないので、初めに目を通しておくと理解しやすくなります。忘れても見直せばよいので大丈夫。

トランク(trunk)
- 日本語に訳すと「幹」です。バージョン管理では、ソースコードを木に例えます。
- 一つの製品は一つのソースコードを元に開発します。トランクは製品ソースコードの主流をなすソースコードです。
ブランチ(branch)
- 日本語に訳すと「枝」です。主流のソースコードから枝分かれしたソースコードをブランチと呼びます。
- 派生したバージョンや製品を開発する場合、または次バージョンを並行開発する場合などにトランクからソースコードを枝分かれした、ブランチソースコードで開発を行います。
リポジトリ(repository)
- ファイルを保存する保存領域です。トランクやブランチが保存される先になります。
クローン(clone)
- リポジトリの複製を作成することを指します。ゼロから開発をなじめる場合でなければ、GitHub等にあるリポジトリのクローンを作成して開発することになります。
コミット(commit)
- リポジトリに保存する変更のことを指します。コミットするだけでは、リポジトリには保存されません。後述するステージングエリアに登録されるだけです。実際にリポジトリに保存するにはプッシュ(push)が必要になります。
ステージングエリア(staging area)
- Gitの機能で、開発者が編集したファイル部分だけをリポジトリに保存するための機能です。コミットでステージングエリアにファイルを登録します。
プッシュ(push)
- リポジトリにコミットを保存することを指します。ステージングエリアにあるファイルがリポジトリに保存される対象となります。
プル(pull)
- 他の人の変更を現在のブランチに取り込むことを指します。複数人で開発する場合に、他の人の変更を取り込む際に行います。
タイムライン(timeline)
- 変更履歴のことをタイムラインといいます。誰がいつどんな変更を行ったかが記録されます。
master
- このブランチで最後に行われたコミットのことを指す。
HEAD
- 現在のブランチを指します。通常はmasterと同じブランチを指しているが、git checkoutコマンドでHEADは移動できます。つまり、過去の特定のブランチにさかのぼれるということです。Gitがタイムマシンと呼ばれるゆえんです。

環境

GitHubアカウント
- リモートリポジトリを作成するに、GitHubアカウントが必要になります。
Git for Windows
Visual Studio Code
Visual Studio Code拡張機能
- Git Lens
  - Gitのタイムラインが見やすくするプラグインです。

環境構築

必要な開発環境を構築しますが、詳細は省略します。（おいおい追記していきます。）

GitHubアカウントを登録
Git for Windowsをインストール
Visual Studio Codeをインストール
Git Lensをインストール
Git Bashで以下を実行
```
git config --global user.name 'username`
git config --global user.email 'xxx@users.noreply.github.com'
git config --global core.editor 'code --wait'
git config --global merge.tool 'code --wait "$MERGED"'
git config --global push.default simple
```
Gitを使用するには最低限、名前とメールアドレスを設定する必要があります。

ここで設定しているメールアドレスはコミット時に登録され、プッシュすると公開されます。プライベートなアドレスは使用しないようにします。

リポジトリの作成と設定

リポジトリはローカル上（PC）のリポジトリとリモート上（GitHub）のリポジトリがあります。

ローカルリポジトリとリモートリポジトリの両方を作成し、関連付けることでVSCodeからリモートリポジトリ（GitHub）へソースをプッシュすることができます。

以下の手順を実行して、リポジトリの作成と関連付けを行います。

ローカルリポジトリを作成する。
VSCodeのアクティビティーバーから[ソース管理]をクリックし、[＋]（リポジトリの初期化）をクリックします。すると[フォルダの選択画面]が表示されるので、ソースを管理するワークスペースフォルダを選択します。
リモートリポジトリを作成する。
GitHubにログインします。右上にある[＋]をクリックし、[New repository]をクリックします。すると作成するリポジトリ情報（名前、説明、公開／非公開）を入力する画面になるので入力し、[Create repository]をクリックします。
リモートリポジトリのURLをコピーする。
リポジトリが作成されるとリポジトリの画面になるので、[Quick setup]にあるをクリックし、リポジトリのURLをコピーします。
ターミナル（PowerShell）で以下のコマンドを実行し、リモートリポジトリの設定を追加します。
```
git remote add origin <リモートリポジトリのURL>
```
ターミナル（PowerShell）で以下のコマンドを実行します。（こうしておくことで次回からプッシュするだけでよくなります。）
```
git push -u origin master
```
なお、このコマンドを初めて実行した場合、GitHub Login画面がでますので、GitHubアカウントでログインします。
以上でリモートリポジトリの登録が完了です。

リモートリポジトリへプッシュする

ソース管理画面で＋をクリックし、スタッシュします。
ソース管理画面で✓をクリックし、ローカルリポジトリにコミットします。
ソース管理画面の...をクリックし、[プッシュ]を選択し、リモートリポジトリにプッシュする。

エラー時の対処方法

プッシュ時に「リポジトリには、プッシュ先として構成されているリモートがありません。」というエラーメッセージが表示される。

これは、まだリモートリポジトリを設定していないためです。上記の「リポジトリの作成と設定」でリモートリポジトリの設定を行うと解消されます。

プッシュ時に「remote: error: GH007: Your push would publish a private email address.」のエラーが出た場合

プライベートなメールアドレスが登録されているから、プッシュするとメールアドレスが公開されるよ、という警告。 Gitにログインしている状態で、Email settingsにアクセスすると「Keep my email address private」の項目に、「xxx@users.noreply.github.com」というダミーのアドレスが記載されている。