Visual Studio Codeとは｜使い方入門と最初の1週間・拡張機能10選

VS Code の本体は「編集・検索・Git・ターミナル」を受け持ち、言語ごとの機能は拡張機能が足します。Python や Node.js の実行環境そのものは、別に入れます。

flowchart TD
    V[VS Code 本体<br>編集・検索・Git・ターミナル] --> E[拡張機能<br>Python・ESLint など]
    E --> R[言語の実行環境<br>Python・Node.js は別に入れる]
    V --> T[統合ターミナル<br>OS のシェル]
    T --> R

よく調べられることの答えを先にまとめます。

確認環境：Ubuntu 24.04.5 LTS の上で、VS Code が裏で使う道具を実際に動かして確かめました。Python 3.13.18 の venv（humanize 4.16.0・debugpy 1.8.22）と Node.js 22.23.4 で最小のプロジェクトを作って実行し、Python のデバッグは debugpy を 127.0.0.1 で待ち受けさせ、自作の小さなクライアントから Debug Adapter Protocol（DAP）のメッセージを送って、ブレークポイントで止まる・変数を読む・式を評価するまでの往復を記録しました。Node.js は --inspect-brk で起動してデバッグ用の待ち受けを確かめています。.vscode の settings.json・launch.json・extensions.json は、VS Code と同じ Microsoft の JSONC パーサー（jsonc-parser 3.3.1）で読めるかを検査し、Git 2.43.0 で git status の表示とソース管理ビューの記号の対応を確かめました。画面の日本語名は Microsoft の日本語言語パックの訳文（GitHub の vscode-loc）、ソース管理の記号は VS Code のソースコード（extensions/git）で確かめています。VS Code 本体は GUI のため動かしておらず、code コマンドの .deb は packages.microsoft.com への接続がこの環境で拒否されたため取得できませんでした。そのため画面の操作・code コマンド・インストール手順・Copilot は、公式ドキュメント（code.visualstudio.com/docs）、Visual Studio Marketplace、GitHub Docs、Microsoft Learn で1つずつ確かめた範囲だけを書いています。図は mermaid で描画を確かめています（確認日 2026年10月29日）。

VS Code（Visual Studio Code）とは：できることと最初の1週間

この節では、VS Code が何をする道具なのか、何が無料で何が別に要るのか、最初の1週間で覚える順番が分かります。

VS Code は、ソースコードを書く・探す・動かす・直す・記録する作業を、1つのウィンドウで行うためのエディターです。公式の FAQ は、VS Code を「デバッグ・タスク・バージョン管理の道具を備えた、すっきりしたエディター」と位置づけ、より重い作業は Visual Studio のような統合開発環境に任せる、と説明しています。

• 料金：公式の FAQ は「個人・商用のどちらでも無料」としています。GitHub Copilot は別の契約で、無料プランがあります。
• ライセンス：GitHub の vscode リポジトリ（Code - OSS）は MIT ライセンスで、配布されている VS Code はそれを元にした Microsoft の製品ライセンスです（FAQ）。
• 対応 OS：Windows（Microsoft がサポート中の 64bit のクライアント版。Windows Server は対象外）、macOS（Apple がセキュリティ更新を出している版）、Linux（Ubuntu Desktop 20.04・Debian 10・RHEL 8・Fedora 36 以降、glibc 2.28 以降）。推奨は 1.6GHz 以上の CPU と 1GB のメモリです（公式の Requirements）。
• 更新：Windows・Mac・Linux のセットアップのページには、毎週リリースされ、自動更新に対応すると書かれています。
• 別に要るもの：Python・Node.js などの実行環境と Git は、VS Code に入っていません。公式の Python と Node.js のチュートリアルも、まず実行環境を入れる手順から始まります。

最初の1週間で覚える順番

毎日少しずつ触る前提で、使う頻度が高い順に並べました。各日の操作は、この記事の節に対応しています。

1. 11日目：フォルダーを開き、画面の名前を覚えるエクスプローラー・エディター・パネル・ステータス バー
2. 22日目：コマンドパレットとクイック オープンCtrl+Shift+P と Ctrl+P の2つで、ほとんどの操作にたどり着く
3. 33日目：使う言語の拡張機能を入れる入れすぎない。発行元と ID を確かめる
4. 44日目：統合ターミナルでプログラムを動かすCtrl+` で開き、python・node を実行する
5. 55日目：ブレークポイントと F5 のデバッグprint を足す前に、止めて変数を見る
6. 66日目：ソース管理ビューで Git を使う変更を見る→ステージ→コミット
7. 77日目：設定とプロファイルを整えるチームで揃える設定は .vscode に置く

VS CodeとVisual Studioの違い

この節では、名前の似た Visual Studio と VS Code が別の製品であることと、どちらを選ぶかの目安が分かります。

Visual Studio は Windows 用の統合開発環境（IDE）、VS Code は3つの OS で動く軽量なコードエディターです。Microsoft Learn は、Visual Studio を「アプリを 1 か所で開発、ビルド、デバッグ、テスト、デプロイできる Windows 用の IDE」と説明し、軽量のクロスプラットフォームのエディターとして VS Code を案内しています。

Java や Kotlin を中心に使うなら JetBrains の IDE も候補です。違いは関連記事「JetBrainsとは｜IDE一覧・選び方・料金・無料の条件とVS Code比較」で扱っています。

VS Codeのインストール（Windows・Mac・Linux）

この節では、OS ごとのインストールの選び方と、code コマンドを使えるようにする方法が分かります。

入手先は公式サイト（code.visualstudio.com）だけにします。OS ごとの要点を公式のセットアップのページで確かめました。

• Windows：セットアップが PATH に追加するので、コンソールを開き直すと code . でフォルダーを開けます。セットアップでは GitHub Copilot CLI（copilot コマンド）を一緒に入れるかも選べます。Copilot CLI には Copilot の契約が要ります。ZIP 版もあり、こちらは更新を手で行います。
• Mac：Universal・Intel・Apple シリコン用があり、Universal はどちらの Mac でも動きます。.dmg を開き、Visual Studio Code.app をアプリケーションへドラッグします。code コマンドは、コマンドパレットで「Shell Command: Install 'code' and optionally 'copilot' commands in PATH」を実行すると使えます。
• Linux：.deb・.rpm・snap があります。.deb は入れるときに Microsoft の apt リポジトリと署名鍵を追加するかを尋ね、追加すると apt で更新されます。

Ubuntu で apt のリポジトリを手で登録する手順は、公式では次のとおりです（この環境では packages.microsoft.com への接続が拒否されたため、実行はしていません）。

sudo apt install wget gpg &&
wget -qO- https://packages.microsoft.com/keys/microsoft.asc | sudo gpg --dearmor -o /usr/share/keyrings/microsoft.gpg

# /etc/apt/sources.list.d/vscode.sources を次の内容で作る
Types: deb
URIs: https://packages.microsoft.com/repos/code
Suites: stable
Components: main
Architectures: amd64,arm64,armhf
Signed-By: /usr/share/keyrings/microsoft.gpg

sudo apt update &&
sudo apt install code    # Insiders 版は code-insiders

# snap の場合
sudo snap install --classic code

Windows・Mac・Linux の画面つきの手順と、日本語化（Japanese Language Pack）、日本語にならないときの直し方は、関連記事「VSCode日本語化の方法｜拡張機能1つで切り替える手順と直らない時の対処」で扱っています。この記事では、入れたあとの使い方を中心にします。

code コマンドでできること

ターミナルから VS Code を開く code コマンドの主なオプションです（公式の Command Line Interface のページ）。

画面の名前と役割（アクティビティ バー・サイド バー・パネル）

この節では、VS Code の画面の6つの場所の名前と、それぞれで何をするかが分かります。

画面の名前を覚えると、公式ドキュメントや記事の「〜を開く」がすぐ分かります。英語名は公式の User Interface のページ、日本語名は Microsoft の日本語言語パックの訳文です。

コマンドパレット・クイック オープンと最初のショートカット

この節では、VS Code のほぼすべての操作にたどり着く2つの入口と、最初に覚える少数のショートカットが分かります。

メニューを探す前に、コマンドパレット（Ctrl+Shift+P、Mac は ⇧⌘P）を開いて、やりたいことの単語を打ちます。日本語の画面では「すべてのコマンドの表示」という名前です。ファイル名で開くときは、クイック オープン（Ctrl+P、Mac は ⌘P。日本語の画面では「ファイルに移動」）を使います。

この記事で使うショートカットを、公式ドキュメントで確かめてまとめました（Windows・Linux の表記。Mac は Ctrl を ⌘ に読み替えるものが多いですが、ターミナルの Ctrl+` などは Mac でも ⌃ です）。

130項目のショートカットと変更の方法（keybindings.json）は、関連記事「VSCodeショートカット一覧｜Win/Mac対応130項目とAI操作・変更方法」で扱っています。

拡張機能の入れ方と最初に入れる10個

この節では、拡張機能の入れ方・外し方・コマンドでの入れ方と、最初の候補10個、入れるときに確かめることが分かります。

拡張機能は、アクティビティ バーの拡張機能（Ctrl+Shift+X）で名前を検索し、「Install」を押して入れます。入れたあとはボタンが歯車（Manage）に変わり、そこから無効化（全体・このワークスペースだけ）とアンインストールを選べます。拡張機能は 発行元.名前 の ID で区別され、詳細ページの Marketplace Info に載っています（公式）。

最初に入れる候補10個

使う言語と作業に合わせて選びます。全部を入れる必要はなく、上から必要なものだけを選びます。インストール数は 2026年10月29日時点の Visual Studio Marketplace の表示です。

ID を指定して、ターミナルから入れることもできます。公式の Command Line Interface のページにある書き方で、上の10個を並べると次のようになります（--install-extension は繰り返し書けます。@版 を付けると版を指定できます）。

code --install-extension MS-CEINTL.vscode-language-pack-ja \
     --install-extension ms-python.python \
     --install-extension ms-toolsai.jupyter \
     --install-extension dbaeumer.vscode-eslint \
     --install-extension esbenp.prettier-vscode \
     --install-extension editorconfig.editorconfig \
     --install-extension eamodio.gitlens \
     --install-extension ms-vscode-remote.remote-wsl \
     --install-extension ms-vscode-remote.remote-ssh \
     --install-extension ms-vscode-remote.remote-containers

code --list-extensions --show-versions   # 入っている拡張機能と版の一覧
code --uninstall-extension eamodio.gitlens

• Python 拡張機能を入れると、Pylance（補完）・Python Debugger（デバッグ）・Python Environments（環境の管理）が既定で一緒に入ります（Marketplace の説明）。別々に探して入れなくて済みます。
• ESLint 拡張機能は、ESLint 本体を使いません。Marketplace の説明は、プロジェクトに npm install --save-dev eslint で入れることを勧めています。
• 拡張機能が入る場所は、Windows が %USERPROFILE%\.vscode\extensions、Mac・Linux が ~/.vscode/extensions です。
• 拡張機能は既定で自動更新されます。extensions.autoUpdate で止められます。

チームで「この拡張機能を入れて」と伝える

コマンドパレットの「Extensions: Configure Recommended Extensions (Workspace Folder)」で .vscode/extensions.json を作ると、フォルダーを初めて開いた人に、入れる拡張機能が案内されます（公式）。手元で作ったファイルです。

{
  "recommendations": ["ms-python.python", "editorconfig.editorconfig"]
}

Plan と Act を切り替えて AI に作業させる拡張機能 Cline は、関連記事「Clineとは｜VS Codeでの使い方・Plan/Act・MCP・料金」で扱っています。

VS CodeでPythonを動かす（venv・インタープリターの選択）

この節では、VS Code で Python のファイルを実行するまでの手順と、「自分の PC では動くのに VS Code では ModuleNotFoundError」の原因が、実行した結果で分かります。

VS Code で Python を動かすときに大切なのは、「どの Python（インタープリター）で動かすか」です。公式の Python のチュートリアルは、Python 拡張機能を入れ、フォルダーを開き、仮想環境を作り、インタープリターを選ぶ順に進みます。

同じファイルを2つの Python で動かした結果

次の app.py を作り、.venv にだけ humanize（数字を3桁区切りにするライブラリ）を入れました。

import humanize


def total(prices):
    s = 0
    for p in prices:
        s += p
    return s


items = [("ノートPC", 158000), ("モニター", 32800), ("キーボード", 12980)]
for name, price in items:
    print(f"{name}: {humanize.intcomma(price)}円")
print("合計:", humanize.intcomma(total([p for _, p in items])), "円")

$ python3 -m venv .venv
$ ls .venv/bin
Activate.ps1  activate  activate.csh  activate.fish  pip  pip3  pip3.13  python  python3  python3.13
$ .venv/bin/python -m pip install humanize debugpy
$ .venv/bin/python -m pip list
Package  Version
-------- -------
debugpy  1.8.22
humanize 4.16.0
pip      26.2.2

$ python3 app.py                 # .venv ではない Python（インタープリターの選び間違い）
Traceback (most recent call last):
  File "/dev/shm/54/hello-py/app.py", line 1, in <module>
    import humanize
ModuleNotFoundError: No module named 'humanize'

$ .venv/bin/python app.py        # .venv の Python
ノートPC: 158,000円
モニター: 32,800円
キーボード: 12,980円
合計: 203,780 円

同じファイルでも、選んだ Python によって結果が変わりました。VS Code の▷ボタンは、選んでいるインタープリターで実行します。pip install したのに ModuleNotFoundError になるときは、ステータス バーの Python の版の表示を押して、パッケージを入れた環境（ここでは .venv）を選び直します。.venv/pyvenv.cfg には、元になった Python の場所が書かれていました。

home = /usr/local/bin
include-system-site-packages = false
version = 3.13.18
executable = /usr/local/bin/python3.13
command = /usr/local/bin/python3 -m venv /dev/shm/54/hello-py/.venv

include-system-site-packages = false は、元の Python に入っているパッケージを venv から見せない設定です。ターミナルで venv を有効にする（activate）コマンドは、上の ls .venv/bin のとおりシェルごとに別のファイル（activate・activate.fish・Activate.ps1 など）が用意されています。ノートブック（.ipynb）は Jupyter 拡張機能で開けます。

デバッグの使い方（launch.json・ブレークポイント・F5の裏側）

この節では、ブレークポイントを置いて止める手順、launch.json の書き方、F5 を押したときに VS Code とデバッガーの間で何が起きているかが、実際のメッセージで分かります。

行番号の左をクリック（または F9）で赤い点のブレークポイントを置き、F5 で始めると、その行の手前で止まって変数を見られます。止まったら、F10 で1行進む（ステップ オーバー）、F11 で関数の中へ（ステップ イン）、Shift+F11 で関数から出る、F5 で次のブレークポイントまで進む、Shift+F5 で止める、です（公式）。

launch.json の書き方

F5 だけで動かない（引数を渡したい、別のファイルから始めたい）ときは、実行とデバッグ ビュー（Ctrl+Shift+D）の「launch.json ファイルを作成」で .vscode/launch.json を作ります。type（使うデバッガー）・request（launch か attach）・name（一覧に出る名前）が必須です。Python 用に作り、Microsoft の JSONC パーサーで読めることを確かめたファイルです。

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Python Debugger: Current File",
      "type": "debugpy",
      "request": "launch",
      "program": "${file}",
      "console": "integratedTerminal"
    },
    {
      "name": "Attach (127.0.0.1:5678)",
      "type": "debugpy",
      "request": "attach",
      "connect": { "host": "127.0.0.1", "port": 5678 }
    }
  ]
}

F5 の裏側：デバッガーと交わすメッセージ

VS Code は、言語ごとのデバッガーと Debug Adapter Protocol（DAP）という共通の形式でやり取りします。DAP の仕様ページは、開発ツールと各言語のデバッガーの通信を「抽象的なプロトコル」に揃えるものだと説明しています。Python のデバッガー debugpy は「Python 3 向けの DAP の実装」です（debugpy の README）。

flowchart TD
    A[VS Code<br>F5・ブレークポイント] -->|DAP の要求| B[デバッガー<br>debugpy など]
    B -->|実行を制御| C[プログラム<br>app.py]
    C -->|止まった位置・変数| B
    B -->|stopped・variables| A

debugpy を 127.0.0.1 で待ち受けさせ、VS Code の代わりに自作の小さなクライアントから、VS Code の画面操作にあたる要求を送りました。app.py の7行目（s += p）にブレークポイントを置いています。

$ .venv/bin/python -m debugpy --listen 127.0.0.1:45678 --wait-for-client app.py &
$ python3 dap_client.py 45678 app.py 7
>> initialize {"clientID": "vscode", "adapterID": "debugpy", ...}
<< response initialize success=True
>> attach {"justMyCode": true}
<< event initialized {}
>> setBreakpoints {"source": {"path": "/dev/shm/54/hello-py/app.py"}, "breakpoints": [{"line": 7}]}
<< response setBreakpoints success=True
   breakpoints: [{'verified': True, 'id': 0, 'source': {...}, 'line': 7}]
>> configurationDone {}
<< response configurationDone success=True
<< response attach success=True
<< event process {"name": "app.py", "isLocalProcess": true, "startMethod": "attach"}
<< event thread {"reason": "started", "threadId": 1}
<< event stopped {"reason": "breakpoint", "threadId": 1, ...}
>> stackTrace {"threadId": 1}
   frame: total app.py line 7
   frame: <module> app.py line 14
>> variables {"variablesReference": 4}
   var: p = 158000 (int)
   var: prices = [158000, 32800, 12980] (list)
   var: s = 0 (int)
>> evaluate {"expression": "s + p", "frameId": 2, "context": "repl"}
   evaluate s + p = 158000
>> setBreakpoints {..., "breakpoints": []}
>> continue {"threadId": 1}
<< event continued {"threadId": 1, "allThreadsContinued": true}
<< event terminated {}

画面の「変数」欄は、止まるたびにデバッガーへ stackTrace・scopes・variables を問い合わせた結果です。ブレークポイントが灰色のまま止まらないときは、setBreakpoints の応答で verified が false になっています（ファイルのパスの違い・実行していない行など）。プログラムの出力は、最後まで続行したあとに次のように出ました。

0.00s - Debugger warning: It seems that frozen modules are being used, which may
0.00s - make the debugger miss breakpoints. Please pass -Xfrozen_modules=off
0.00s - to python to disable frozen modules.
0.00s - Note: Debugging will proceed. Set PYDEVD_DISABLE_FILE_VALIDATION=1 to disable this validation.
ノートPC: 158,000円
モニター: 32,800円
キーボード: 12,980円
合計: 203,780 円

先頭の4行は debugpy の警告です。メッセージのとおりデバッグは続き、自分の app.py のブレークポイントでは止まりました。標準ライブラリの中で止めたいときに気にする警告で、消すときはメッセージにある -Xfrozen_modules=off を Python に渡します。

JavaScript・Node.jsの実行とデバッグ

この節では、VS Code で Node.js のプログラムを実行・デバッグする3つの方法と、デバッガーがつなぐ先の実物が分かります。

JavaScript・TypeScript・Node.js のデバッガーは VS Code に入っています（公式）。ただし Node.js 本体は別に入れます。公式の Node.js のチュートリアルは「Node.js のアプリを動かすには、Node.js のランタイムを入れる必要がある」と書いています。

Node.js 用の launch.json です（JSONC パーサーで検査済み）。skipFiles に <node_internals>/** を書くと、Node.js の組み込みモジュールの中へステップ インしなくなります。

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch app.js",
      "type": "node",
      "request": "launch",
      "program": "${workspaceFolder}/app.js",
      "skipFiles": ["<node_internals>/**"]
    },
    {
      "name": "Attach 9229",
      "type": "node",
      "request": "attach",
      "port": 9229
    }
  ]
}

127.0.0.1 で待ち受ける小さな HTTP サーバー（app.js）を作り、ふつうに起動した場合と、デバッグ用に起動した場合を比べました。

$ node app.js
listening on http://127.0.0.1:45679
$ curl http://127.0.0.1:45679/hello
{"path":"/hello","total":203780}

$ node --inspect-brk=127.0.0.1:45229 app.js
Debugger listening on ws://127.0.0.1:45229/b27234fb-ac38-4fb9-8916-84f16afa9df0
For help, see: https://nodejs.org/learn/getting-started/debugging

$ curl http://127.0.0.1:45229/json/list
[ {
  "description": "node.js instance",
  "id": "b27234fb-ac38-4fb9-8916-84f16afa9df0",
  "title": "app.js",
  "type": "node",
  "url": "file:///dev/shm/54/hello-js/app.js",
  "webSocketDebuggerUrl": "ws://127.0.0.1:45229/b27234fb-..."
} ]

--inspect-brk で起動すると、Node.js は1行目の前で止まり、デバッガーが WebSocket でつなぎに来るのを待ちます。attach の構成は、この待ち受け（既定のポートは 9229）につなぎます。--inspect は止まらずに動き始め、--inspect-brk はつながるまで止まる、という違いです（公式）。

ターミナルとGit連携（ソース管理ビュー）

この節では、統合ターミナルの開き方と、ソース管理ビューの記号（U・A・M など）が Git のどの状態にあたるかが、実際の git status で分かります。

統合ターミナル

Ctrl+`（バッククォート）でターミナルが開き、開いているフォルダー（ワークスペースのルート）から始まります。新しいターミナルは Ctrl+Shift+`、分割は Ctrl+Shift+5（Mac は ⌘\）です。使うシェルは OS の既定で、ターミナルのプロファイルの一覧から選び直せます。出力に出たファイル名や URL は、Ctrl（Mac は ⌘）を押しながらクリックすると開きます。

ソース管理ビューの記号と git status

ソース管理ビュー（Ctrl+Shift+G）は、Git の状態をファイル名の横の1文字で表示します。Git 本体は別に入れます（公式は「Git をインストールする」と案内しています）。記号は VS Code のソースコード（extensions/git の getStatusLetter）で確かめ、同じ操作を git コマンドで行って表示を並べました。

$ git init -b main
$ git status --porcelain          # まだ何も登録していない
?? .gitignore
?? .vscode/
?? app.py

$ git add .
$ git status --porcelain          # ステージした
A  .gitignore
A  .vscode/extensions.json
A  .vscode/launch.json
A  .vscode/settings.json
A  app.py

$ git commit -m "最初のコミット"
$ (app.py を1行直し、notes.md を新しく作る)
$ git status --porcelain
 M app.py
?? notes.md
$ git log --oneline
699661e 最初のコミット

ソースコードには「⚠ は Windows で見栄えが悪いので ! を使う」というコメントがあり、競合は ! で表示されます。ソース管理ビューでは「変更」と「ステージされている変更」の2つの欄に分かれ、ファイルの + で「変更をステージ」、上の入力欄にメッセージを書いて「コミット」です。

• コミットは手元の記録で、サーバーには送られません。送るのは push、取り込むのは pull、両方を続けて行うのが「変更の同期」です（公式）。
• ステージしていないままコミットを押すと、日本語の画面では「ステージされている変更がなく、コミットできません。すべての変更をステージして、直接コミットしますか?」と尋ねられます（言語パックの訳文）。
• 競合は、行ごとの操作か3方向のマージ エディターで直します。タイムライン ビューでは、1つのファイルのコミットと保存の履歴を見られます。

設定の階層・プロファイル・ワークスペースの信頼

この節では、設定がどこに保存され、どちらが優先されるか、言語ごとの設定の書き方、プロファイルと「制限モード」の意味が分かります。

設定は「ユーザー設定（PC 全体）」と「ワークスペース設定（そのフォルダーだけ）」の2段で考えます。設定エディターは Ctrl+,（Mac は ⌘,）、JSON で直接書くときはコマンドパレットの「ユーザー設定を開く (JSON)」です。

公式の優先順位は、既定値 → ユーザー → リモート → ワークスペース → ワークスペース フォルダー の順で、後ろほど強く、言語ごとの設定はさらに強く、管理者のポリシーが最も強い、です。値が文字・数値・配列なら上書き、オブジェクトなら合わさります。実行ファイルの場所を指す設定（git.path など）と、更新・セキュリティの設定は、ワークスペース設定では変えられません。

手元で作ったワークスペース設定です。言語ごとの設定は "[python]" のように言語 ID を角括弧で囲みます。

{
  // このフォルダーだけの設定（ワークスペース設定）
  "editor.formatOnSave": true,
  "files.exclude": {
    "**/__pycache__": true
  },
  "[python]": {
    "editor.tabSize": 4
  },
}

settings.json はコメントと末尾のカンマを書ける「JSONC」です。同じファイルを Node.js の JSON.parse と、Microsoft の jsonc-parser（末尾カンマを許す指定）で読んだ結果です。

## .vscode/settings.json
JSON.parse: Expected property name or '}' in JSON at position 4 (line 2 column 3)
jsonc-parser: OK {"editor.formatOnSave":true,"files.exclude":{"**/__pycache__":true},"[python]":{"editor.tabSize":4}}

## カンマを1つ忘れたファイル
{
  "editor.formatOnSave": true
  "editor.tabSize": 4
}
JSON.parse: Expected ',' or '}' after property value in JSON at position 34 (line 3 column 3)
jsonc-parser: CommaExpected at line 3

コメントは JSON としては誤りでも、settings.json としては正しく読めました。一方、カンマ忘れは JSONC でも誤りで、その場合は「設定が効かない」原因になります。おすすめの設定の全文と各項目の解説は、関連記事「VS Code settings.jsonおすすめ設定｜コピペ用全文と各項目解説」で扱っています。

プロファイル

プロファイルは、設定・キーボード ショートカット・拡張機能・スニペット・タスク・MCP サーバー・画面の配置をひとまとめにして切り替える仕組みです。歯車（管理）のメニューか「ファイル > ユーザー設定 > プロファイル」から作り、Python・Data Science・Doc Writer・Node.js・Angular・Java General・Java Spring のテンプレートを選べます。仕事用と勉強用で拡張機能を分けたいときに使います。.code-profile のファイルか GitHub の secret gist で書き出して共有できます。

ワークスペースの信頼と制限モード

見知らぬフォルダーを開くと、日本語の画面では「このフォルダー内のファイルの作成者を信頼しますか?」と尋ねられます（言語パックの訳文）。信頼しないと「制限モード」で開き、フォルダーの中のコードが勝手に動かないようになります。公式によると、制限モードでは次のものが止まるか、信頼を求められます。

• 1ターミナルを開く既定で止められ、フォルダーを信頼するかを尋ねられる
• 2タスクとデバッグ実行しようとすると信頼を求められる
• 3実行ファイルを指すワークスペース設定一部が無効になる
• 4拡張機能・AI エージェント対応していない拡張機能は無効か機能を絞って動く。エージェントは動かない

迷うときは制限モードのまま中身を読み、信頼できると分かってから、ステータス バーの「制限モード」の表示から信頼します。親フォルダーを信頼すると、その中のフォルダーもすべて信頼されます。security.workspace.trust.enabled で機能ごと切れますが、公式は勧めていません。

VS CodeとGitHub Copilot

この節では、VS Code での GitHub Copilot の位置づけ、始め方、プランと無料の範囲、AI の機能を使わない設定が分かります。

GitHub Copilot は、VS Code の中で入力の続きを提案し（インライン提案）、チャットやエージェントで作業を任せられる AI の機能です。VS Code 本体は無料で、Copilot は GitHub の別の契約です。始めるときは、ステータス バーの Copilot のアイコンから「Use AI Features」を選び、GitHub アカウントでサインインします。契約が無いアカウントは Copilot Free に登録されます（公式の Set up ページ）。

GitHub Docs（日本語）で確かめたプランです（2026年10月29日時点）。

• AI の機能を使わないときは、設定 chat.disableAIFeatures を有効にします。チャットとインライン提案が隠れ、Copilot の拡張機能も無効になります。ユーザー設定にもワークスペース設定にも書けます。
• Free プランは、既定でテレメトリー（利用状況の送信）が有効です。telemetry.telemetryLevel を off にすると止められます（公式）。
• 会社のコードを送る前に、GitHub Copilot Trust Center と社内の決まりを確かめるよう、公式は案内しています。

ショートカット・スラッシュ コマンドの一覧と細かい設定は、関連記事「GitHub Copilotの使い方｜ショートカット・コマンド一覧と設定」で扱っています。

VS Codeでよくあるエラー・つまずきと判断表

この節では、VS Code を使い始めた人がつまずきやすいエラーの原文と、その直し方、迷ったときの判断の目安が分かります。

エラーの多くは VS Code そのものではなく、選んでいる Python・ターミナル・設定ファイルで起きています。この環境で実際に出た原文と、言語パック・公式で確かめた文言です。

判断表：迷ったときの目安

よくある質問

Q. Visual Studio Code は無料ですか？会社で使っても問題ありませんか？ A. 公式の FAQ は「個人・商用のどちらでも無料」としています。GitHub Copilot は別の契約で、無料プラン（Copilot Free）と有料プランがあります。会社で使うときは、社内の決まり（拡張機能・AI の利用）を確かめます。

Q. VS Code と Visual Studio は何が違いますか？ A. Visual Studio は Windows 用の統合開発環境で、Community（無料）・Professional・Enterprise があります。VS Code は Windows・Mac・Linux で動く軽量なエディターで、拡張機能で言語の機能を足します。

Q. VS Code をインストールしただけで Python は動きますか？ A. 動きません。Python 本体と Python 拡張機能（ms-python.python）を入れ、インタープリターを選びます。拡張機能を入れると Pylance・Python Debugger・Python Environments も一緒に入ります。

Q. pip install したのに ModuleNotFoundError になります。 A. パッケージを入れた Python と、VS Code が実行に使っている Python が違います。手元でも、.venv に入れた humanize は .venv の Python なら動き、別の Python では ModuleNotFoundError になりました。「Python: Select Interpreter」で選び直します。

Q. launch.json は必ず作りますか？ A. 開いているファイルを F5 で動かすだけなら作らなくても始められます。引数・環境変数・作業フォルダーを決めたいとき、すでに動いているプログラムにつなぐ（attach）ときに作ります。

Q. settings.json にコメントを書いてもエラーになりませんか？ A. なりません。settings.json は JSONC で、コメントと末尾のカンマを書けます。手元でも JSON.parse は失敗し、jsonc-parser は読めました。カンマ忘れは JSONC でもエラーです。

Q. Copilot を使わない設定はありますか？ A. 設定 chat.disableAIFeatures を有効にすると、チャットとインライン提案が隠れ、Copilot の拡張機能も無効になります。ワークスペースごとにも設定できます。

Q. 開いたフォルダーで「制限モード」と出て、ターミナルやデバッグが使えません。 A. ワークスペースの信頼の機能です。自分で作ったフォルダーなら、ステータス バーの「制限モード」の表示から信頼します。出どころの分からないフォルダーは、中身を読んでから判断します。

Q. ブレークポイントを置いても止まりません。 A. 実行に使っている構成がデバッグ（F5）になっているか、止めたい行が実際に通るかを確かめます。デバッガーは置いた点ごとに「止められるか（verified）」を返し、止められない点は灰色になります。Python は justMyCode が有効だと、ライブラリの中では止まりません。

Q. VS Code は今どの版で、どのくらいの頻度で更新されますか？ A. 2026年10月29日時点で、公式の更新情報ページの最新は 1.143（1.143.1）です。セットアップのページには毎週リリースされると書かれており、Windows・Mac は既定で自動更新されます。

まとめ

• VS Code は Microsoft の無料のコードエディター。Visual Studio（Windows 用の IDE）とは別の製品で、Python・Node.js・Git の本体は別に入れる。
• 最初の1週間は、画面の名前→コマンドパレット（Ctrl+Shift+P）→拡張機能→ターミナル→デバッグ→Git→設定の順に覚える。
• Python は「どのインタープリターで動かすか」が要。手元では .venv の Python では動き、別の Python では ModuleNotFoundError になった。
• F5 のデバッグは、VS Code とデバッガーが DAP で setBreakpoints・stopped・variables をやり取りしている。止まらないときは verified を疑う。
• 設定はユーザーとワークスペース（.vscode/settings.json）の2段。settings.json はコメントが書ける JSONC。Copilot は別契約で、使わない設定（chat.disableAIFeatures）もある。

次に読むとよい記事は、本文の各節で紹介した日本語化・ショートカット一覧・settings.json のおすすめ設定・GitHub Copilot の使い方の4本です。

参考・出典

確認日はいずれも 2026年10月29日です。

• Visual Studio Code「User interface」：https://code.visualstudio.com/docs/getstarted/userinterface
• Visual Studio Code「Extension Marketplace」：https://code.visualstudio.com/docs/configure/extensions/extension-marketplace
• Visual Studio Code「Command Line Interface (CLI)」：https://code.visualstudio.com/docs/configure/command-line
• Visual Studio Code「Settings」：https://code.visualstudio.com/docs/configure/settings
• Visual Studio Code「Profiles」：https://code.visualstudio.com/docs/configure/profiles
• Visual Studio Code「Workspace Trust」：https://code.visualstudio.com/docs/editing/workspaces/workspace-trust
• Visual Studio Code「Python in VS Code（Getting Started with Python）」：https://code.visualstudio.com/docs/python/python-tutorial
• Visual Studio Code「Python debugging」：https://code.visualstudio.com/docs/python/debugging
• Visual Studio Code「Debugging」「Debug configuration」：https://code.visualstudio.com/docs/debugtest/debugging
• Visual Studio Code「Node.js debugging」「Node.js tutorial」：https://code.visualstudio.com/docs/nodejs/nodejs-debugging
• Visual Studio Code「Source Control」：https://code.visualstudio.com/docs/sourcecontrol/overview
• Visual Studio Code「Terminal basics」：https://code.visualstudio.com/docs/terminal/basics
• Visual Studio Code「Set up GitHub Copilot」「Copilot cheat sheet」：https://code.visualstudio.com/docs/copilot/setup
• Visual Studio Code「Setup（Windows・macOS・Linux）」：https://code.visualstudio.com/docs/setup/linux
• Visual Studio Code「Requirements」「FAQ」：https://code.visualstudio.com/docs/supporting/faq
• Visual Studio Code「Updates」：https://code.visualstudio.com/updates
• Visual Studio Marketplace（Python・Jupyter・ESLint・Prettier・EditorConfig・GitLens・WSL・Remote - SSH・Dev Containers・Japanese Language Pack・Bracket Pair Colorizer 2）：https://marketplace.visualstudio.com/vscode
• Microsoft「vscode-loc」（日本語言語パックの訳文）：https://github.com/microsoft/vscode-loc
• Microsoft「vscode」extensions/git/src/repository.ts：https://github.com/microsoft/vscode/blob/main/extensions/git/src/repository.ts
• Debug Adapter Protocol「Overview」：https://microsoft.github.io/debug-adapter-protocol/overview
• Microsoft「debugpy」：https://github.com/microsoft/debugpy
• Microsoft Learn「Visual Studio IDE へようこそ」：https://learn.microsoft.com/ja-jp/visualstudio/get-started/visual-studio-ide
• GitHub Docs「GitHub Copilot のプラン」：https://docs.github.com/ja/copilot/get-started/plans

株式会社RJC ― SI事業・SES事業・AI駆動開発。RJCは一緒に成長を楽しめる会社です。