Visual Studio Codeのインストールから日本語化までの初期設定手順

2021-05-04Others,VS Code,Windows

Visual Studio Code(VS Code)のダウンロードからインストール、画面テーマの変更、日本語化までの初期設定の手順です。
Windows端末へのインストールを例として解説します。

※Windows11の環境を利用して手順を確認しています。

スポンサーリンク

Visual Studio Codeのインストール手順

Visual Studio Codeとは

Visual Studio Code(マイクロソフト社サイト)

Visual Studio Codeは、さままざまソフトウェアを開発するためのエディタです。
Microsoftがオープンソースとして無料で提供しており、PythonやTypeScriptなど多くのプログラミング言語に対応しています。
Windows OSだけではなく、MacやLinuxなどのプラットフォームで利用できます。
多くの拡張機能が提供されており、GitHubとの連携も可能です。
Azureリソースの操作やコンテナ管理、Terraformの実行環境としても利用できるなど、さまざまな用途に対応しています。

インストール手順

Visual Studio Codeは、公式サイトからダウンロードしてインストールします。
複数のインストーラーが提供されており、それぞれ用途に応じて選択できます。

    • System Installer:システム全体にインストールされ、PCを利用しているすべてのユーザーが利用できます
    • User Installer:インストールを実行したユーザーのみが利用できます
    • Zip:ダウンロード後にファイルを解凍して利用します

Zip形式の場合は、インストールせずに利用できますが、パスなどを自分で設定する必要があります。
それ以外にも、VSCode CLIをダウンロードして利用することができます。

インストーラーは、Visual Studio Codeの公式サイトやVisual Studioのサイトからダウンロードできます。

Visual Studio Code(マイクロソフト社サイト)
Download Visual Studio Code

インストール手順

Visual Studio Codeの公式サイトからインストーラーをダウンロードします。
今回は、User Installerをダウンロードしてインストールします。

Visual Studio Code(マイクロソフト社サイト)

インストーラーのダウンロードページ(Visual Studio Codeのインストール手順)

Download Visual Studio Code

インストーラーのダウンロードページ(Visual Studio Codeのインストール手順)

VSCodeUserSetup-x64-1.99.3.exeという名前でインストーラーのファイルがダウンロードされています。
ダウンロードしたインストーラーをクリックしてインストールを開始します。

※記事記載時点のバージョンです。

ダウンロードしたインストーラー(Visual Studio Codeのインストール手順)

使用許諾契約書の同意の確認画面が表示されます。
内容を確認し問題がなければ、同意するを選択します。
次へを選択します。

使用許諾契約書の同意画面(Visual Studio Codeのインストール手順)

インストール先の指定の画面です。
デフォルトではユーザのAppDataは以下にインストールされます。
変更しない場合はそのまま次へをクリックします。

※System Installerを使用した場合、インストールディレクトリはProgram Files配下になります。

インストール先の指定画面(Visual Studio Codeのインストール手順)
スタートメニューフォルダーの指定の画面です。
表示名を設定します。
変更せず次に進めます。
スタートメニューフォルダーの指定画面(Visual Studio Codeのインストール手順)

追加タスクの選択の画面です。
デスクトップアイコンの追加やエクスプローラーメニューの表示設定を選択します。

※デスクトップ上にアイコンを追加する場合は、チェックを入れます。

追加タスクの選択画面(Visual Studio Codeのインストール手順)

インストール準備完了の画面です。
内容を確認しインストールを開始します。

インストールの準備完了画面(Visual Studio Codeのインストール手順)

正常終了すると完了画面が表示されます。
Visual Studio Codeを実行するにチェックを入れておくと、完了後に自動起動します。

セットアップウィザードの完了画面(Visual Studio Codeのインストール手順)

Visual Studio Codeが起動します。

インストール直後のVisual Studio Code画面(Visual Studio Codeのインストール手順)

Visual Studio Code 画面表示の色を変更する手順

Visual Studio Codeでは、画面配色のテーマを変更できます。
コマンドパレット

画面テーマの変更手順

左側のアクテビティバーにある設定を選択します。
“Themes(テーマ)"にある、"Color Themes(配色テーマ)"を選択します。
“Light Modern"を選択すると背景の表示を白くできます。

Visual Studio Codeの配色テーマ設定箇所(Visual Studio Codeのインストール手順)
コマンドパレットからも設定を表示できます。 コマンドパレットで配色テーマのメニューを選択(Visual Studio Codeのインストール手順)
選択できるThemes(テーマ)の一覧が表示されます。
“Light Modern"を選択すると背景の表示を白くできます。
Visual Studio Codeの配色テーマ選択(Visual Studio Codeのインストール手順)
Visual Studio Codeの配色テーマでLight Modernを選択した場合(Visual Studio Codeのインストール手順)

—広告—

Visual Studio Codeのメニュー表示を日本語化する手順

Visual Studio Codeのメニュー表示を日本語化します。
日本語の言語パッケージをインストールします。

日本語化手順

Visual Studio Codeを起動します。
Viewにある"Command Palette"を選択します。

※CTRLキー+Shiftキー+PでもCommand Paletteを表示できます。

コマンドパレットを表示(Visual Studio Codeの日本語化手順)
Command Paletteに"Language"と入力します。
“Configure Display Language"を選択します。
画面表示言語設定を選択(Visual Studio Codeの日本語化手順)
日本語を選択します。
言語パックのインストールが開始されます。
画面表示言語で日本語を選択してインストール(Visual Studio Codeの日本語化手順)

再起動の確認メッセージが表示されます。
Restartを選択して、Visual Studio Codeを再起動します。

再起動確認画面(Visual Studio Codeの日本語化手順)
メニューが日本語で表示されていることを確認できます。 日本語メニューで表示されているVisual Studio Code(Visual Studio Codeの日本語化手順)

最後に

Visual Studio Codeのインストール、画面の色の変更、日本語化までの初期設定手順を確認しました。
Visual Studio Codeには多くの拡張機能が提供されており、カスタマイズすることで非常に使いやすいエディタになります。

引き続き、いろいろ試してみたいと思います。

Visual Studio CodeでAzure CLIやAzure PowerShellを使うための設定手順はこちらで紹介しています。

Azure CLIやAzure PowerShellを使ったAzureへのサインインのコマンドをまとめて紹介しています。

Tera Termのインストールから表示の日本語化、文字化け対応の手順を紹介しています。

Rocky LinuxでのPythonやpipのインストール手順はこちらで紹介しています。
Pythonのバージョン切り替え方法だけではなく、インストール手順も紹介しています。

Azure Portalの表示言語を変更する手順について紹介しています。
画面例を使いながら手順を紹介しています。

スポンサーリンク