「コード書いて、ターミナル開いて、実行して、また戻って…」 「複数のターミナルウィンドウを管理するのが大変…」 「エディタとターミナルを行き来するのが面倒…」
プログラミングをしていると、エディタとターミナルの切り替えって本当に面倒ですよね。実は、VSCodeの統合ターミナルを使えば、エディタから一歩も離れずにすべてのコマンド操作ができるんです！
この記事では、統合ターミナルの基本から、複数ターミナルの管理、カスタマイズ、さらには知られざる便利機能まで、完全解説していきます。
統合ターミナルって何？普通のターミナルとの違い
VSCode内蔵のコマンドライン環境
統合ターミナル（Integrated Terminal）とは： VSCodeのエディタ内に組み込まれた、コマンドラインインターフェースのこと。
簡単に言うと、VSCodeの中で動くターミナルです！
普通のターミナルとの決定的な違い
統合ターミナルのメリット：
- ウィンドウの切り替え不要：Alt+Tabを押さなくていい
- 作業ディレクトリが自動設定：開いているプロジェクトのフォルダーがカレント
- エディタとの連携：ファイルパスをドラッグ&ドロップできる
- 複数ターミナルを簡単管理：タブで切り替え可能
- 出力結果をコピペしやすい：マウスで選択してコピー
使えるシェルの種類
Windows：
- PowerShell（デフォルト）
- Command Prompt（cmd）
- Git Bash
- WSL（Ubuntu、Debianなど）
Mac/Linux：
- bash
- zsh（macOS Catalinaから標準）
- fish
- その他お好みのシェル
統合ターミナルを開く・操作する基本
ターミナルを開く3つの方法
方法1：ショートカットキー（最速！）
- Ctrl+`（バッククォート）
- Mac: Cmd+`
これが最も早い方法です！
方法2：メニューから
- 上部メニュー → 「ターミナル」→「新しいターミナル」
方法3：コマンドパレット
- Ctrl+Shift+P → 「Terminal: Create New Terminal」
ターミナルの表示位置
デフォルトは下部パネルですが、自由に変更できます：
- 右クリック → 「Move Panel Right」：右側に移動
- 右クリック → 「Move Panel Left」：左側に移動
- ドラッグ：好きな位置にドッキング
基本的なキーボードショートカット
【必須ショートカット】
Ctrl+` : ターミナルの表示/非表示
Ctrl+Shift+` : 新しいターミナルを作成
Ctrl+Shift+5 : ターミナルを分割
Ctrl+PageUp/PageDown : ターミナル間の切り替え
Ctrl+Shift+[ : ターミナルにフォーカス
複数ターミナルの管理術
新しいターミナルを追加
3つの追加方法：
- 「+」ボタンをクリック
- Ctrl+Shift+`
- ドロップダウンから選択して異なるシェルを追加
ターミナルの分割表示
画面を分割して並べる：
- ターミナルを選択
- Ctrl+Shift+5（Mac: Cmd+Shift+5）
- または分割アイコンをクリック
これで、複数のコマンドを同時に実行・監視できます！
使用例：
左側：npm run dev（開発サーバー）
右側：git status（Git操作）
ターミナルに名前を付ける
分かりやすい名前で管理：
- ターミナルタブを右クリック
- 「Rename」を選択
- 名前を入力（例：「Server」「Git」「Build」）
プロジェクトが大きくなっても、どのターミナルが何をしているか一目瞭然！
便利な連携機能
ファイルパスの自動入力
ドラッグ&ドロップ： エクスプローラーからファイルをドラッグして、ターミナルにドロップ → ファイルパスが自動入力される！
右クリックメニュー： ファイルを右クリック → 「Copy Path」または「Copy Relative Path」
コマンドの実行結果をエディタで開く
# 実行結果を新しいファイルに
ls -la > file_list.txt
code file_list.txt
# パイプで直接VSCodeに
echo "Hello World" | code -
リンクの自動検出
ターミナル内の以下がクリック可能になります：
- ファイルパス：クリックでファイルを開く
- URL：クリックでブラウザーを開く
- エラー箇所：
file.js:10:5のような表記をクリックで該当行へジャンプ
Ctrlキー（Mac: Cmd）を押しながらクリック！
カスタマイズで作業効率アップ
デフォルトシェルの変更
settings.jsonで設定：
// Windows
{
"terminal.integrated.defaultProfile.windows": "Git Bash",
"terminal.integrated.profiles.windows": {
"PowerShell": {
"source": "PowerShell",
"icon": "terminal-powershell"
},
"Git Bash": {
"path": "C:\\Program Files\\Git\\bin\\bash.exe",
"icon": "terminal-bash"
}
}
}
// Mac
{
"terminal.integrated.defaultProfile.osx": "zsh"
}
// Linux
{
"terminal.integrated.defaultProfile.linux": "bash"
}
見た目のカスタマイズ
{
// フォント設定
"terminal.integrated.fontFamily": "MesloLGS NF",
"terminal.integrated.fontSize": 14,
"terminal.integrated.lineHeight": 1.2,
// カーソル設定
"terminal.integrated.cursorBlinking": true,
"terminal.integrated.cursorStyle": "line",
// スクロール設定
"terminal.integrated.scrollback": 10000,
// ベル音を無効化
"terminal.integrated.enableBell": false
}
カラーテーマの設定
{
"workbench.colorCustomizations": {
// 背景色
"terminal.background": "#1e1e1e",
// 文字色
"terminal.foreground": "#cccccc",
// カーソル色
"terminalCursor.foreground": "#ffffff",
// 選択色
"terminal.selectionBackground": "#264f78"
}
}
知っておくと便利な隠れ機能
コマンド履歴の検索
Ctrl+R：コマンド履歴を検索（bashやzshの場合）
入力し始めると、過去のコマンドが候補として表示されます。
ターミナルの内容をクリア
3つの方法：
- Ctrl+L：画面をクリア（履歴は残る）
- clearコマンド：同上
- Ctrl+K（Mac: Cmd+K）：VSCode独自のクリア
実行中のプロセスを停止
Ctrl+C：実行中のコマンドを中断
無限ループや長時間実行から脱出！
ターミナル出力を検索
Ctrl+F：ターミナル内を検索
大量の出力から特定の文字列を探すのに便利！
プログラミング言語別の活用例
Node.js/JavaScript
# 開発サーバーを起動
npm run dev
# テストを実行
npm test
# ビルド
npm run build
複数ターミナルの使い分け：
- ターミナル1：開発サーバー
- ターミナル2：テスト実行
- ターミナル3：Git操作
Python
# 仮想環境を有効化
source venv/bin/activate # Mac/Linux
venv\Scripts\activate # Windows
# スクリプト実行
python main.py
# パッケージインストール
pip install -r requirements.txt
Java
# コンパイル
javac Main.java
# 実行
java Main
# Mavenビルド
mvn clean install
タスクランナーとの連携
tasks.jsonで自動化
.vscode/tasks.json：
{
"version": "2.0.0",
"tasks": [
{
"label": "Run Server",
"type": "shell",
"command": "npm run dev",
"presentation": {
"reveal": "always",
"panel": "new"
},
"problemMatcher": []
}
]
}
実行方法：
- Ctrl+Shift+P
- 「Tasks: Run Task」
- タスクを選択
ビルドタスクの設定
{
"label": "Build",
"type": "shell",
"command": "npm run build",
"group": {
"kind": "build",
"isDefault": true
}
}
Ctrl+Shift+Bで即座にビルド実行！
トラブルシューティング
Q1: ターミナルが文字化けする
日本語の文字化け対策：
{
// 文字コードを設定
"terminal.integrated.unicodeVersion": "11",
// Windowsの場合
"terminal.integrated.profiles.windows": {
"PowerShell": {
"source": "PowerShell",
"args": ["-NoExit", "-Command", "chcp 65001"]
}
}
}
Q2: パスが通らない
環境変数の設定：
{
"terminal.integrated.env.windows": {
"PATH": "${env:PATH};C:\\my\\custom\\path"
}
}
Q3: ターミナルが重い・遅い
パフォーマンス改善：
{
// GPU レンダリングを無効化
"terminal.integrated.gpuAcceleration": "off",
// スクロールバックを減らす
"terminal.integrated.scrollback": 1000,
// レンダラーを変更
"terminal.integrated.rendererType": "canvas"
}
Q4: WSLが使えない
WSLを有効化：
- Windows機能の有効化
- WSLをインストール
- VSCodeで設定：
{
"terminal.integrated.defaultProfile.windows": "Ubuntu (WSL)"
}
統合ターミナルを最大限活用するコツ
ワークスペース設定で自動化
.vscode/settings.json：
{
// プロジェクト起動時に自動でターミナルを開く
"terminal.integrated.automationShell.linux": "/bin/bash",
// 起動時のコマンド
"terminal.integrated.shellArgs.linux": [
"-c",
"echo 'Welcome to the project!' && exec bash"
]
}
ターミナルのレイアウト保存
複数ターミナルの配置を保存：
- 理想的なレイアウトを作成
- ワークスペースを保存
- 次回起動時も同じレイアウトに
エイリアスの活用
~/.bashrc や ~/.zshrc に追加：
# よく使うコマンドのエイリアス
alias gs='git status'
alias ga='git add .'
alias gc='git commit -m'
alias gp='git push'
alias nr='npm run'
まとめ：統合ターミナルで開発速度を2倍に！
VSCodeの統合ターミナル、もはや無くてはならない機能ですね！
今日から実践したい3つのポイント：
- Ctrl+` でターミナルを即座に開く習慣をつける ウィンドウ切り替えの時間を削減！
- 複数ターミナルを名前付きで管理 「Server」「Git」「Test」など、役割を明確に
- ファイルパスはドラッグ&ドロップ 手入力のミスとさようなら
さらに効率化するなら：
- カスタムシェルプロファイルを設定
- タスクランナーと連携
- ワークスペース設定で自動化
統合ターミナルを使いこなせば、エディタから離れることなく、すべての作業が完結します。コーディング、テスト、ビルド、デプロイ…すべてがVSCode内で。
まずはCtrl+`を押して、統合ターミナルの便利さを体感してください。きっと、もう普通のターミナルには戻れなくなりますよ！
コメント