VSCode 検索・置換 完全ガイド - ワークスペース全体を効率的に探索

VSCode 検索機能で開発効率を飛躍的に向上させる

Visual Studio Code（VSCode）の検索機能は、コードベースの探索からリファクタリングまで、あらゆる開発作業の根幹を支える重要な機能です。単純なテキスト検索にとどまらず、正規表現による高度なパターンマッチング、シンボルベースのナビゲーション、参照検索（Go to References）まで、VSCodeには多層的な検索機能が実装されています。

本記事では、VSCode 検索機能を体系的に解説し、ファイル内検索からワークスペース全体検索、検索エディタの活用、シンボル検索、参照検索（Go to References）まで、すべての検索機能を網羅します。実践的なユースケースと設定の最適化手法を併せて紹介し、検索機能を使いこなすための完全ガイドとして構成しています。

この記事で得られること

• VSCode ファイル内検索と置換の基本操作から応用テクニック
• ワークスペース全体検索の効率的な使い方と除外パターン設定
• 正規表現検索と大文字小文字変換を使った高度な置換パターン
• 検索エディタ（Search Editor）を活用した検索結果の管理
• シンボル検索（Go to Symbol）とワークスペースシンボル検索
• 参照検索（Go to References）とPeek機能の活用
• 検索関連設定の最適化とパフォーマンスチューニング

前提条件と実行環境

VSCode 検索機能を効果的に活用するための環境要件を確認します。

キー表記の凡例

本記事では、Windows/Macの両方に対応した表記を使用します。

VSCode ファイル内検索の基本操作

VSCode ファイル内検索は、現在開いているエディタ内でテキストを検索・置換する最も基本的な機能です。Ctrl+F（Mac: Cmd+F）で検索ウィジェットが開き、入力と同時にリアルタイムで検索が実行されます。

検索ウィジェットの起動と基本操作

VSCode 検索では、検索ウィジェットを開いた時点でエディタ内の選択テキストまたはカーソル位置の単語が自動的に検索ボックスに入力されます。この動作はeditor.find.seedSearchStringFromSelection設定で制御できます。

検索オプションの切り替え

VSCode 検索には、検索精度を高めるための3つの主要オプションがあります。

1
2
3
4
5
6

// 検索オプションのデフォルト設定
{
  "editor.find.seedSearchStringFromSelection": "selection",
  "editor.find.autoFindInSelection": "multiline",
  "editor.find.addExtraSpaceOnTop": true
}

選択範囲内検索

大きなファイルで特定の範囲内だけを検索したい場合、選択範囲内検索が有効です。Alt+L（Mac: Option+L）で選択範囲内検索モードを切り替えられます。

1
2
3
4

// 複数行選択時に自動で選択範囲内検索を有効化
{
  "editor.find.autoFindInSelection": "multiline"
}

設定値には以下の3つがあります。

複数行検索

VSCode 検索では、複数行にまたがるテキストパターンも検索できます。検索ボックス内でCtrl+Enterを押すと改行を挿入でき、複数行のテキストを検索対象に指定できます。

長いテキストを検索する場合、検索ウィジェットの左端をドラッグしてサイズを拡大できます。ダブルクリックで最大化/デフォルトサイズに切り替わります。

ワークスペース全体検索の活用

VSCode ワークスペース検索（Ctrl+Shift+F）は、プロジェクト全体のファイルを横断して検索する機能です。関数名の使用箇所の把握、APIエンドポイントの追跡、設定値の確認など、コードベース全体を俯瞰する作業に不可欠です。

ワークスペース検索の基本操作

検索結果はファイルごとにグループ化され、各ファイル内のヒット数と位置が表示されます。結果をクリックすると該当箇所がエディタで開きます。

検索対象ファイルの絞り込み

VSCode ワークスペース検索では、検索対象を特定のファイルやフォルダに限定できます。検索詳細オプション（Ctrl+Shift+J）を展開すると、「含めるファイル」と「除外するファイル」の入力欄が表示されます。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

# 含めるファイルの指定例
*.ts                    # すべてのTypeScriptファイル
src/**                  # srcフォルダ以下のすべてのファイル
./config/**             # ワークスペースルートのconfigフォルダ
{**/*.html,**/*.css}    # HTMLとCSSファイル

# 除外するファイルの指定例
node_modules/**         # node_modulesを除外
**/*.test.ts            # テストファイルを除外
**/dist/**              # ビルド出力を除外

Globパターンの詳細

VSCode 検索で使用できるGlobパターンの構文を理解すると、より精密な検索対象の指定が可能になります。

フォルダから検索（Find in Folder）

エクスプローラービューでフォルダを右クリックし、「フォルダーで検索」を選択すると、そのフォルダ内に限定した検索が開始されます。大規模プロジェクトで特定のモジュールやコンポーネント内を検索する際に便利です。

クイック検索（Quick Search）

コマンドパレット（Ctrl+Shift+P）から「Search: Quick Search」を実行すると、ワークスペース全体をすばやく検索できるクイック検索が利用できます。検索結果がドロップダウンで表示され、即座にファイルを開けます。

VSCode 検索の除外パターン設定

効率的なワークスペース検索には、不要なファイルやフォルダを除外する設定が重要です。VSCodeでは複数の設定で除外パターンを管理します。

files.excludeとsearch.excludeの違い

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

// settings.jsonでの除外パターン設定
{
  // エクスプローラーと検索の両方から除外
  "files.exclude": {
    "**/.git": true,
    "**/.svn": true,
    "**/.hg": true,
    "**/CVS": true,
    "**/.DS_Store": true,
    "**/Thumbs.db": true
  },
  
  // 検索のみから除外（files.excludeに追加で適用）
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/*.code-search": true,
    "**/dist": true,
    "**/build": true,
    "**/coverage": true,
    "**/.next": true,
    "**/__pycache__": true
  }
}

.gitignoreとの連携

検索ビューの「除外するファイル」入力欄には、「除外設定と無視ファイルを使用」トグルボタンがあります。このボタンがオンの場合、.gitignoreで指定されたファイルとfiles.exclude/search.excludeで指定されたファイルの両方が検索から除外されます。

外部ライブラリやビルド出力も検索対象に含めたい場合は、このトグルをオフにします。

プロジェクト固有の除外設定

.vscode/settings.jsonにプロジェクト固有の除外パターンを設定できます。チームで共有することで、全員が同じ検索体験を得られます。

1
2
3
4
5
6
7
8
9

// .vscode/settings.json
{
  "search.exclude": {
    "**/generated/**": true,
    "**/vendor/**": true,
    "**/*.min.js": true,
    "**/*.bundle.js": true
  }
}

正規表現検索の実践テクニック

VSCode 正規表現検索は、パターンマッチングによる高度な検索・置換を可能にします。Alt+R（Mac: Option+R）で正規表現モードを有効化できます。

基本的な正規表現パターン

キャプチャグループと後方参照

正規表現の括弧()でキャプチャしたグループは、置換文字列で$1、$2として参照できます。

1
2
3
4
5
6
7
8

# 検索パターン
function (\w+)\(

# 置換パターン
const $1 = (

# 結果
function handleClick(  →  const handleClick = (

大文字小文字変換（Case Changing）

VSCode 正規表現置換では、キャプチャグループの大文字小文字を変換できます。

1
2
3
4
5
6
7
8
9

# 検索パターン（スネークケースの変数名）
([a-z]+)_([a-z]+)

# 置換パターン（キャメルケースに変換）
$1\u$2

# 結果
user_name  →  userName
first_item →  firstItem

複合的な変換も可能です。

1
2
3
4
5
6
7
8
9

# 検索パターン
([a-z])([a-z]+)

# 置換パターン（先頭大文字、以降小文字）
\u$1\L$2

# 結果
HELLO  →  Hello
world  →  World

実践的な正規表現検索パターン集

コンソールログの検索と削除

1
2
3
4

# 検索パターン
console\.(log|warn|error|debug)\([^)]*\);?\n?

# 置換パターン（空文字で削除）

import文の検索

1
2

# 検索パターン（React関連のimport）
^import\s+.*\s+from\s+['"]react.*['"];?$

コメント行の検索

1
2
3
4
5

# 単一行コメント
^\s*//.*$

# 複数行コメント
/\*[\s\S]*?\*/

TODO/FIXMEコメントの検索

1
2

# 検索パターン
(TODO|FIXME|HACK|XXX):\s*(.*)

検索エディタ（Search Editor）の活用

VSCode 検索エディタは、検索結果を通常のエディタタブで表示する機能です。検索結果を俯瞰し、コンテキスト（前後の行）を確認しながらコードを分析できます。

検索エディタの開き方

検索エディタの特徴

検索エディタでは、検索結果がシンタックスハイライト付きで表示され、各結果の前後に指定した行数のコンテキストが表示されます。

1
2
3
4

// コンテキスト行数の設定（デフォルト1行）
{
  "search.searchEditor.defaultNumberOfContextLines": 2
}

検索エディタからのナビゲーション

検索エディタの結果から元のファイルへジャンプする方法があります。

検索エディタの設定

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

{
  // 新規検索エディタ作成時に前回の設定を再利用
  "search.searchEditor.reusePriorSearchConfiguration": true,
  
  // シングルクリック時の動作
  "search.searchEditor.singleClickBehaviour": "peekDefinition",
  
  // ダブルクリック時の動作
  "search.searchEditor.doubleClickBehaviour": "goToLocation"
}

キーバインドによる検索エディタのカスタマイズ

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

// keybindings.jsonでの設定例
{
  "key": "ctrl+shift+e",
  "command": "search.action.openNewEditor",
  "args": {
    "query": "",
    "triggerSearch": false,
    "focusResults": false
  }
}

シンボル検索（Go to Symbol）

VSCode シンボル検索は、関数、クラス、変数、インターフェースなどのプログラム要素を検索する機能です。テキスト検索とは異なり、言語サービスが解析した構造情報に基づいて検索します。

ファイル内シンボル検索

Ctrl+Shift+O（Mac: Cmd+Shift+O）でファイル内のシンボル一覧が表示されます。

graph LR
    A[Ctrl+Shift+O] --> B{入力}
    B -->|シンボル名| C[名前で絞り込み]
    B -->|:で始める| D[カテゴリ別表示]
    C --> E[選択でジャンプ]
    D --> E

ワークスペースシンボル検索

Ctrl+T（Mac: Cmd+T）でワークスペース全体からシンボルを検索できます。ファイルを跨いでクラスや関数を探す際に非常に強力です。

1
2
3

# 使用例
Ctrl+T → "UserService" と入力
→ プロジェクト内のUserServiceクラスの定義箇所にジャンプ

クイックオープンからのシンボル検索

Ctrl+P（Mac: Cmd+P）で開くクイックオープンから、特殊な接頭辞を使ってシンボル検索を呼び出せます。

参照検索（Go to References）とPeek機能

VSCode 参照検索は、シンボルが使用されているすべての箇所を検索する機能です。リファクタリングや影響範囲の調査に不可欠です。

参照検索の基本操作

Peekウィンドウの操作

Peekウィンドウは、エディタ内にインラインで表示される小さなエディタです。参照元を確認しながら、その場で編集もできます。

1
2
3
4
5

// Peekウィンドウの設定
{
  // ダブルクリックやEscapeでPeekを閉じない
  "editor.stablePeek": true
}

定義へ移動の詳細機能

Ctrlキーを押しながらシンボルにホバーすると、定義のプレビューがツールチップで表示されます。そのままCtrl+Clickで定義にジャンプ、Ctrl+Alt+Clickで横に定義を開きます。

graph TB
    A[シンボル上でCtrl+ホバー] --> B[定義プレビュー表示]
    B --> C{クリック}
    C -->|Ctrl+Click| D[定義へジャンプ]
    C -->|Ctrl+Alt+Click| E[横に定義を開く]

シンボル名の変更（Rename Symbol）

F2キーで、シンボルの名前をワークスペース全体で一括変更できます。VSCode 参照検索の情報を活用して、すべての使用箇所を自動的に更新します。

1
2
3

# 使用例
const userName = "John";  ← ここでF2を押して "displayName" に変更
console.log(userName);    ← 自動的に displayName に更新

コードナビゲーション機能

VSCode 検索機能と密接に関連するコードナビゲーション機能を紹介します。

ブレッドクラム（Breadcrumbs）

エディタ上部に表示されるブレッドクラムは、現在位置のファイルパスとシンボルパスを表示します。各要素をクリックすると、兄弟要素のドロップダウンが表示され、素早くナビゲートできます。

問題パネル（Problems Panel）

Ctrl+Shift+Mで問題パネルを開き、プロジェクト全体のエラーと警告を一覧表示できます。VSCode 検索機能と組み合わせて、問題のあるコードを効率的に特定・修正できます。

検索関連設定の最適化

VSCode 検索機能のパフォーマンスと使いやすさを最適化する設定をまとめます。

推奨設定一覧

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

{
  // ファイル内検索
  "editor.find.seedSearchStringFromSelection": "selection",
  "editor.find.autoFindInSelection": "multiline",
  "editor.find.addExtraSpaceOnTop": true,
  "editor.find.loop": true,
  
  // ワークスペース検索
  "search.smartCase": true,
  "search.showLineNumbers": true,
  "search.useGlobalIgnoreFiles": true,
  "search.followSymlinks": false,
  "search.collapseResults": "auto",
  
  // 検索除外設定
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/*.code-search": true,
    "**/dist": true,
    "**/build": true,
    "**/coverage": true,
    "**/.next": true,
    "**/out": true
  },
  
  // 検索エディタ
  "search.searchEditor.defaultNumberOfContextLines": 2,
  "search.searchEditor.reusePriorSearchConfiguration": true,
  
  // シンボル検索
  "workbench.quickOpen.preserveInput": true,
  "workbench.quickOpen.closeOnFocusLost": true
}

設定の解説

大規模プロジェクトでの最適化

大規模なコードベースで検索パフォーマンスを維持するための追加設定です。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

{
  // 検索結果の上限（デフォルト20000）
  "search.maxResults": 10000,
  
  // 検索をワーカースレッドで実行
  "search.useRipgrep": true,
  
  // ファイル監視の除外
  "files.watcherExclude": {
    "**/.git/objects/**": true,
    "**/.git/subtree-cache/**": true,
    "**/node_modules/**": true,
    "**/.hg/store/**": true
  }
}

実践的なワークフロー

リファクタリングワークフロー

関数名を変更するリファクタリングの典型的なワークフローです。

1. 影響範囲の調査: 関数上でShift+F12（参照検索）を実行し、使用箇所を確認
2. 型情報の確認: Alt+F12（定義をPeek）で戻り値の型を確認
3. 一括変更: F2（Rename Symbol）で安全に名前を変更
4. 検証: Ctrl+Shift+M（問題パネル）でエラーがないことを確認

デバッグワークフロー

エラーメッセージからソースコードを特定するワークフローです。

1. エラー文字列で検索: Ctrl+Shift+Fでエラーメッセージをワークスペース検索
2. 関連コードの探索: 見つかった箇所からShift+F12で参照を追跡
3. 呼び出し元の特定: ブレッドクラムとPeek機能で呼び出し階層を把握
4. 修正と確認: 修正後、Ctrl+Shift+Mでエラーが解消されたことを確認

コードレビューワークフロー

レビュー時に特定パターンを探すワークフローです。

1. 検索エディタで概観: Search Editor: Open New Search Editorで検索エディタを開く
2. 正規表現で危険パターンを検索: eval\(|innerHTML\s*=|document\.write などのセキュリティリスクパターン
3. コンテキスト確認: 検索エディタのコンテキスト行で前後のコードを確認
4. 該当箇所へジャンプ: F12で元のファイルを開いて詳細確認

ショートカット一覧

VSCode 検索機能に関連する主要なショートカットをまとめます。

ファイル内検索

ワークスペース検索

シンボル検索とナビゲーション

まとめ

VSCode 検索機能は、テキスト検索、正規表現検索、シンボル検索、参照検索という多層的な機能を提供しています。それぞれの特性を理解し、適切な場面で使い分けることで、コードベースの探索とリファクタリングを効率的に行えます。

検索関連の設定を最適化し、ショートカットを習得することで、VSCodeの検索機能を最大限に活用できるようになります。特に大規模プロジェクトでは、除外パターンの適切な設定がパフォーマンスと生産性に大きく影響します。

本記事で紹介したテクニックを日常の開発に取り入れ、VSCodeの検索機能をマスターしてください。

参考リンク

• Visual Studio Code - Basic Editing - VSCode公式ドキュメント（検索・置換）
• Visual Studio Code - Code Navigation - VSCode公式ドキュメント（コードナビゲーション）
• Visual Studio Code - Glob Patterns - Globパターンリファレンス
• Visual Studio Code - Settings Reference - 設定リファレンス