Windows 10にVisual Studio CodeとGitをインストールする

皆さんはテキストエディタに何を使っていますか？僕はつい最近AtomからVisual Studio Codeに乗り換えました。Visual Studio Codeは通称vscode(VS Code)と呼ばれ、Microsoftが開発しているクロスプラットフォームなテキストエディタです。WindowsでもMacでもLinuxでも無料で使えるので、どのテキストエディタにしようか迷っている人はvscodeをつかってみてはいかがでしょうか？この記事ではWindows10でVisual Studio CodeとGitをインストールする手順を簡単に解説してみようと思います。

vscodeインストール完了までの注意点

まずはVisual Studio Codeの公式ページに行くとこの記事の一番最初の画像のようなトップページが出てくるので、赤枠のボタンをクリックしてダウンロードを開始してください。

ダウンロードが終わったら、ダウンロードしたファイルをダブルクリックしてvscodeのインストールを開始します。vscode自体のインストールは簡単なのでスクリーンショットなどは省きます。手順通りにデフォルトの設定のままでインストール完了まで進めればOKです。

ただ1点だけ補足。vscodeのセットアップ途中で上の画像のような｢追加タスクの選択｣ダイアログが出てきます。デフォルトでは一番下のPATHへの追加（再起動後に使用可能）にだけチェックが入ってます。デフォルトのままでも良いですが、僕は全部の項目にチェックを入れました。個人的には全部の項目にチェックを入れてインストールすることをオススメします。

vscodeを日本語化する

vscodeのインストールが完了して一番最初に起動するとこんな感じの画面になります。見た目（ユーザーインターフェイス、UI）が英語のままです。英語が苦手な人にはちょっと使いにくいですよね。右下の方にポップアップが出てきてるはずなので、よくご覧になってもらうと・・・｢表示言語を日本語に変更するには言語パックをインストールします｣というメッセージがあるので、そこの｢インストールして再起動｣ボタンクリックしてもらうと言語バックのインストールが自動で開始して、終わったらvscodeが勝手に再起動します。再起動後にvscodeのUIが日本語化されていれば、問題解決です。

もし右下に日本語化を促す通知が出ない場合は

場合によっては右下に日本語化を促すメッセージが出ないこともありますので、その場合には手動で日本語化の拡張機能を追加してください。

左端にボタンが5つ並んでますが、一番下のボタンを押して拡張機能関連のパネルを開きます。

検索ボックスに｢japanese｣と入れると一番上に出てくるMicrosoft製の拡張機能｢Japanese Language Pack for Visual Studio Code｣、これをインストールします。マウスで選択すると右側にその拡張機能の詳細が表示されるので、詳細を確認してからインストールするといいでしょう。

画面右側の詳細を確認してからinstallボタンを押してインストール開始です。

VS Codeの右下に｢インストールした日本語化パックの拡張機能を有効化するために再起動しますか?｣と通知が出るのでYesを押してVS Codeを再起動させます。

再起動から復帰したら無事にVisual Studio Codeが日本語化されているはずです。

vscode上でGitを使ったバージョン管理をするには

vscodeに言語パックをインストールしてvscodeが再起動されたらこんな画面になりました。無事に日本語化されてますね。それでは次にGitに関して。vscodeの右下にGitに関するメッセージが出てます。｢Gitが見つかりません。Gitをインストールするか’git.path’設定でパスを構成してください。｣というメッセージが右下に出てきます。Macには初めからGitがインストールされてるのですが、WindowsではGitがデフォルトでインストールされていないので・・・vscode上でGitを使ったバージョン管理が出来ないことを意味してます。

それでは｢Gitのダウンロード｣ボタンを押してWindowsにGitをインストールしてみましょう。ボタンを押すとデフォルトのブラウザで｢Gitの公式サイト｣が開きます。そこからインストーラーをダウンロードして、WindowsにGitをインストールすれば・・・vscode上でGitを使ったバージョン管理が可能になります。

ダウンロードしたファイルをダブルクリックしてインストールを開始します。Windowsお馴染みのユーザーアカウント制御のダイアログ画面が出たら｢はい｣で次に進みましょう。

フリーソフトウェアに関するライセンスがどうたらこうたら書いてます。普通にGitでバージョン管理するだけなら特に意識する必要は無いですが英語が読めるならキチンと読んで次に進みましょう。

Gitをパソコンのどこへインストールしますか？と聞いてきます。どんなソフトでもインストールするときはたいていどこへインストールするか聞かれますが、こういう場合デフォルトのままで次に進んだ方が無難です。そのまま次へ進みましょう。

追加でインストールするコンポーネントの選択画面です。上の画像はデフォルトの状態です。通常このまま次に進んでもらってOKです。チェックが入ってない項目に関して簡単に説明すると、一番上のAdditional iconsにチェックを入れるとデスクトップにショートカットが作られます。Use a TrueType font in all console windowsには絶対にチェックを入れないでください。これにチェックを入れてしまうと日本語などの多バイト文字が文字化けするそうです。Check daily for Git for Windows updatesは自動的に更新があるかをチェックするかしないか？です。自動的にアップデートをチェックしなくても手動でチェックすることが可能です。この辺はお好みです。

Windows10のスタートメニューを覗いてみると分かりますが、たいていどのアプリをインストールしてもアプリと同じ名前のスタートメニューフォルダーの中にアプリ本体のショートカットが収納されています。Gitでもどのフォルダーの中にGitのショートカットを入れるか選ぶことが出来ます。スタートメニューフォルダーを作らないという事も出来ますが、この辺は無理にいじらずに、デフォルトのままで次に進みます。

Gitがデフォルトで使うテキストエディタを選ぶ画面です。インストールしてあるもの（使用可能なもの）が選択肢に出てきますので、ここではもちろんVisual Studio Codeを選びます。

コマンドプロンプト（パワーシェル）からGitを使いたいか？（環境変数PATHに何を追加するか？）を設定する画面です。デフォルトでは｢Use Git from the Windows Command Prompt｣が選択されていて、この状態だとGit BashだけじゃなくコマンドプロンプトやパワーシェルからもGitが使えるようになります。

Gitがプルやプッシュなどでhttpsを使う時にどのルート証明書を使うかの設定です。デフォルトでは一番上の｢Use the OpenSSL library｣が選択されています。ふつうはそのままデフォルトでOKなので、次に進みましょう。

Gitで改行コードをどう取り扱うか？を設定する画面です。ココの部分はいろいろな解説記事を読む限り、かなり意見が分かれる部分です。

1. Checkout Windows-style, commit Unix-style line endings
   【デフォルト】チェックアウト時にCRLFに、コミットする時にLFにする。（true)
2. Checkout as-is, commit Unix-style line endings
   チェックアウト時はそのまま、コミットする時にLFにする。(input)
3. Checkout as-is, commit as-is
   チェックアウト時もコミット時もなにもしない。(false)

よく分からなければ、とりあえずデフォルトの一番上の設定でインストールを進めましょう。個人的には2番目の｢Checkout as-is, commit Unix-style line endings｣を選びました。

[bash title=”改行コードの取り扱い方の変更”]
git config –global core.autocrlf true
[/bash]

git for windowsインストール完了後に、改行コードの取り扱い方を変更したいときは、git bashを起動させて上のコマンドを叩けばOKです。true, input, falseは変更したいものに応じて変更してください。

Git Bushというシェルを使うのに、どのターミナルエミュレータを使うのか？選ぶ画面です。デフォルトでは一番上のUse MinTTYが選ばれてます。デフォルトのまま次に進みましょう。

Enable file system cachingはキャッシュが効くようになってgitの反応が良くなります。Enalbe Git Credential ManagerはGitHubなどに接続するときの二段階認証やssh接続のパスフレーズの入力の手間を無くしてくれるためのもの。Enable symbolic linksはシンボリックリンクを張れるようになります。3つともチェックを入れて次に進みましょう。

インストールが開始されて・・・無事に終わればこの画面です。

git for windowsがインストール完了すれば、Visual Studio Code内部でgit for windowsのgitが使えるようになります。