VSCodeのインストール
プログラマに人気の多機能エディタ
“Visual Studio Code”（ビジュアル・スタジオ・コード）は，Microsoft社が無償で提供しているテキスト・エディタです．動作は軽く，画面のデザインは実際の開発で使いやすいように洗練されており，機能は拡張性に優れています．多くのプログラマから支持されている人気のエディタです．一般的には “VSCode”（ブイ・エス・コード）と略して呼ばれています．
インデックス
動作環境
この記事はWindows10 64bit版を対象としています．他のOSの場合は適宜読み替えてください．また，各Webページやプログラムは2024年10月時点のものです．今後変更される可能性がありますのでご了承ください．
なお，Windowsで拡張子と隠しファイルを表示するの設定が済んでいるものとします．
インストーラをダウンロードする
VSCode公式ページにアクセスします．Windowsの “User Installer” の項目にある [x64] をクリックして，インストーラをダウンロードします．インストーラの保存先は，デスクトップなどのわかりやすい場所を指定すると便利です．
少し待っても自動的にダウンロードが始まらない場合は，画面に表示されているとおり “Try this direct download link.” をクリックしてください．
インストールする
ダウンロードしたインストーラをダブル・クリックして起動します．
インストーラの最初の画面では，「同意する」を選択して [次へ] をクリックします．
インストール先を指定します．今回はデフォルトのままで [次へ] をクリックします．
Windowsのスタート・メニューに登録するショートカット名を設定します．今回はデフォルトのままで [次へ] をクリックします．
「追加タスクの選択」の画面では，各種オプションをお好みで設定してください．今回は「PATHへの追加」だけチェックを付けました．[次へ] をクリックして進みます．
ここまで設定した内容を確認します．問題がなければ [インストール] ボタンをクリックします．
インストールが完了するまで待ちます．
インストールが完了しました．デフォルトで「Visual Studio Codeを実行する」にチェックが入った状態になっています．このまま [完了] ボタンをクリックします．
初めてVSCodeを起動すると，“Welcome” というタブが表示されます．各種オプションを設定できますが，ここでは画面のデザイン・テーマ（Choose your themeの項目）だけ見ておきます．今回はデフォルトの “Dark Modern” を選択しました．お好みで設定してください．
[Welcome] のタブは閉じて構いません．
VSCodeを起動する
ここまでの手順で既にVSCodeが起動していますが，通常のVSCodeの起動方法も確認しておきます．
Windowsのスタート・メニューを開くと，“V” の項目に “Visual Studio Code” が追加されています．この項目を展開すると “Visual Studio Code” のアプリケーションがあるので，これをクリックして起動します．
上図の状態で “Visual Studio Code” のアプリケーションを右クリックすると，コンテキスト・メニュー（いわゆる右クリック・メニュー）が表示されます．この中にある「スタートにピン留めする」をクリックすると，Windowsスタート・メニューの中にVSCodeのショートカット・アイコンが追加されます．VSCodeをよく使う場合は，ショートカットを作っておくと便利です．
日本語表示用の拡張機能をインストールする
VSCodeはデフォルトで英語表記になっているので，日本語化します．英語のままで構わない場合は設定不要です．
画面左側にある「拡張機能」（Extensions）のアイコンをクリックします．拡張機能のタブ（EXTENSIONS: MARKETPLACE）が開くので，検索欄に “Japanese” と入力します．すると “Japanese Language Pack for Visual Studio Code” という拡張機能が見つかるので，[Install] ボタンをクリックしてインストールします．
インストールが完了すると，画面の下部に “Would you like to change Visual Studio Code's display language to Japanese and restart?”（VSCodeで表示する言語を日本語に変更して再起動しますか？） というメッセージが表示されるので，[Change Language and Restart] ボタンをクリックします．VSCodeのウィンドウが閉じて，自動的に起動します．VSCodeのメニューなどの表記が日本語になっていることを確認してください．
これ以降の操作説明では，表示を日本語化した画面を使用します．
文字エンコーディングを自動判別するように設定する
VSCode上部のメニュー・バーから [ファイル] - [ユーザー設定] - [設定] をクリックします．
[設定] というタブが開きます．左側の一覧から [テキスト エディター] の項目を展開し，[ファイル] を選択します．
“Auto Guess Encoding” という項目にチェックを付けます（見つからない場合は「設定」タブ内の検索欄に “Auto Guess Encoding” と打ち込めば表示される）．
これにより，ファイルを開いた時に文字エンコーディングを自動判別するようになります．VSCodeが判別した文字エンコーディング方式は，画面の右下に表示されます（“UTF-8” や “Shift JIS” など）．設定が終わったら「設定」のタブを閉じて構いません．
ターミナルの設定をする
VSCodeは画面内にターミナルを備えており，デバッグのときに便利です．このターミナルはデフォルトで “Windows Power Shell” を使う設定になっているため，一般的な「コマンド・プロンプト」の仕様に変更しておきます．Power Shellのままで良い場合は設定不要です．
画面上部のメニュー・バーから [ターミナル] - [新しいターミナル] をクリックします．もしメニュー・バーに [ターミナル] の項目がない場合は，[...] というボタンをクリックすると表示されます．
画面下部にターミナルの領域が表示されます．次図のように [] ボタンをクリックするとメニューが表示されるので，「既定のプロファイルの選択」をクリックします．
画面上部に選択項目のリストが表示されるので，“Command Prompt” をクリックします．これで，VSCodeでターミナルを表示するとコマンド・プロンプトが呼び出されるようになります．
エクスプローラの挙動を設定する
VSCodeの画面の左側に並んでいるアイコンのうち，一番上のアイコンをクリックすると「エクスプローラー」が表示されます．エクスプローラ領域には，現在開いているフォルダ内のファイル一覧が表示されます．
VSCodeでは複数のファイルを同時に開くことが可能で，画面上部のタブで表示するファイルを切り替えられます．デフォルトでは，タブで編集するファイルを切り替えると「エクスプローラー」側も同期してスクロールし，選択したファイルに自動でフォーカスします．個人的にこの挙動は不便だと感じるので，この機能をOFFにしておきます．デフォルトのままで良い場合は設定不要です．
画面上部のメニュー・バーから [ファイル] - [ユーザー設定] - [設定] をクリックします．
検索欄に “explorer auto reveal” と入力します．
“Explorer: Auto Reveal” という項目が表示されるので，リスト・ボックスの中から “false” を選択します．これで，編集中のファイルを切り替えてもエクスプローラ側は自動で追従しなくなります．
テキストを右端で折り返すように設定する
1行に長いコードを記述すると，画面の外にはみ出ることがあります．このとき，画面上部のメニュー・バーから [表示] - [右端での折り返し] をクリックするとテキストが右端で折り返されて表示されます．
デフォルトで「右端での折り返し」をONにしたい場合は，次のように設定します．画面上部のメニュー・バーから [ファイル] - [ユーザー設定] - [設定] をクリックして「設定」のタブを開きます．
「設定」タブの上部にある検索欄に “word wrap” と入力します．すると “Editor: Word Wrap” という項目が表示されるので [on] を選択します．
Python関係の拡張機能をインストールする
VSCodeの画面左側にある「拡張機能」のアイコンをクリックします．検索欄に “python” と入力するとMicrosoft社純正の “Python” という拡張機能が表示されるので，「インストール」をクリックします．
少し待つとインストールが完了します．Pythonの拡張機能の欄に「インストール済み」と表示されていることを確認してください．
ここでインストールしたのはVSCode上でPythonの文法チェックやデバッグのサポートなどをする機能であり，Pythonインタプリンタ本体ではありません．Pythonで書いたプログラムを実行するには別途Pythonのインタプリタのインストールが必要です．
Pythonのプログラムを実行してみる
既にPythonインタプリタのインストールの作業が完了しているとします．実際にVSCodeでPythonのプログラムを書いて実行してみます．
デスクトップなどのわかりやすい場所に “test.py” というファイルを作ります．ファイルを作りたい場所で [右クリック] - [新規作成] - [テキスト ドキュメント] で作成するか，VSCodeを起動して [ファイル] - [新しいテキストファイル] で空のファイルを作り [ファイル] - [名前を付けて保存] で保存します．
先に空のファイルだけを作成した場合は，VSCodeのメニュー・バーから [ファイル] - [フォルダーを開く] をクリックして，対象のフォルダを開きます．
VSCodeで初めて開くフォルダの場合，「このフォルダー内のファイルの作成者を信頼しますか？」というメッセージが表示されます．今回は自作のプログラムを扱うだけなので，[はい、作成者を信頼します] をクリックします．
新しく作ったファイル “test.py” に以下のコードを記述します．
import numpy as np
import matplotlib.pyplot as plt
#sin curve
x = np.linspace(0, 2*np.pi, 1000)
y = np.sin(x)
#graph area
fig = plt.figure()
ax1 = fig.add_subplot(1, 1, 1)
#draw graph
ax1.plot(x, y, lw=3, color="blue")
plt.show()ソース・コードを書き終えたら，画面上部にある「デバッグ開始ボタン」をクリックします．なお，このボタンはVSCodeにPythonの拡張機能をインストールしていないと表示されません．
次図のようなグラフが表示されれば成功です．もしエラーが出た場合は，ソース・コードを正しく書き写しているか確認してください．また，Pythonインタプリタのインストールで解説しているとおりPythonインタプリタ本体とNumPyモジュール，Matplotlibモジュールがすべてインストールされていることを確認してください．
なお，[F5] キーを押してもプログラムを実行することができます．[F5] キーを押すと画面上部に「デバッグ構成」の選択欄が表示されるので，[Python ファイル 現在アクティブなPythonファイルをデバッグする] をクリックします．一度この設定をすれば，後は [F5] キーを押すだけでプログラムが実行されます．
その他の小ネタ集
VSCodeを便利に使うための備忘録です．
画面を分割して表示する
デバッグの時，画面を分割して複数のソース・コードを並べて表示すると便利です．
VSCodeで複数のソース・コードを開くと，画面上部にファイル名がついたタブが表示されます．デフォルトでは画面に表示されるソース・コードは1つだけであり，タブを切り替えて編集するファイルを選択します．
複数のファイルを開いた状態で，画面上部のメニュー・バーから [表示] - [エディターレイアウト] - [分割（右）] をクリックします．するとVSCodeの画面が左右2つに分割され，選択していたタブが画面の右側に表示されます．他の [分割（左）]，[分割（上）]，[分割（下）] をクリックすると，それぞれ異なるレイアウトになります．また，これらを組み合わせてより細かい分割を作ることもできます．
編集中のファイル以外をまとめて閉じる
大量のファイルを同時に開いて編集していると，タブが増えて操作しづらくなります．このとき，編集中のタブを右クリックして [その他を閉じる] をクリックすると，それ以外のファイルを閉じることができます．他にも [右側を閉じる]，[保存済みを閉じる] など便利な操作が用意されています．
