基本的な編集

Visual Studio Code は何よりもまずエディターであり、生産性の高いソース コード編集に必要な機能を備えています。このトピックでは、エディターの基本について説明し、コード作成をスムーズに開始できるようにします。

キーボードショートカット

コードを記述する際にキーボードから手を離さずにいられることは、高い生産性を維持するために不可欠です。VS Code には豊富なデフォルトのキーボード ショートカットが用意されているほか、カスタマイズも可能です。

• キーボード ショートカット リファレンス - リファレンス シートをダウンロードして、最もよく使われる人気のキーボード ショートカットを学習しましょう。
• キーマップ拡張機能のインストール - キーマップ拡張機能をインストールすることで、以前使っていたエディター (Sublime Text、Atom、Vim など) のキーボード ショートカットを VS Code で使用できます。
• キーボード ショートカットのカスタマイズ - 自分のスタイルに合わせて、デフォルトのキーボード ショートカットを変更できます。

複数選択 (マルチカーソル)

VS Code は、迅速かつ同時編集を可能にするマルチ カーソルをサポートしています。 Alt+クリック で、サブカーソル (細く表示されます) を追加できます。各カーソルは、配置されたコンテキストに基づいて独立して動作します。カーソルを増やす一般的な方法は、⌥⌘↓ (Windows では Ctrl+Alt+Down、Linux では Shift+Alt+Down) または ⌥⌘↑ (Windows では Ctrl+Alt+Up、Linux では Shift+Alt+Up) を使用して、下にカーソルを挿入したり、上に挿入したりすることです。

⌘D (Windows, Linux では Ctrl+D) は、カーソル位置の単語、または現在の選択範囲の次の出現箇所を選択します。

マルチカーソルの修飾キー

マルチカーソルを適用するための修飾キーを、macOS では Cmd+クリック、Windows と Linux では Ctrl+クリック に変更したい場合は、 editor.multiCursorModifier Open in VS Code Open in VS Code Insiders 設定 で変更できます。これにより、Sublime Text や Atom など、他のエディターから移行してきたユーザーも、慣れ親しんだキーボード修飾キーを使い続けることができます。

この設定は以下のように設定できます

• ctrlCmd - Windows では Ctrl、macOS では Cmd に割り当てられます。
• alt - 既存のデフォルトである Alt です。

また、メニュー項目の 選択 > マルチカーソルのために Ctrl+クリック に切り替える または 選択 > マルチカーソルのために Alt+クリック に切り替える を使って、この設定を素早く切り替えることもできます。

定義へ移動 と リンクを開く のジェスチャもこの設定に従い、競合しないように調整されます。たとえば、設定が ctrlCmd の場合、マルチカーソルは Ctrl/Cmd+クリック で追加でき、リンクを開いたり定義に移動したりするのは Alt+クリック で呼び出すことができます。

選択範囲の縮小/拡大

現在の選択範囲を素早く縮小または拡大します。 ⌃⇧⌘← (Windows, Linux では Shift+Alt+Left) および ⌃⇧⌘→ (Windows, Linux では Shift+Alt+Right) でトリガーします。

以下は、⌃⇧⌘→ (Windows, Linux では Shift+Alt+Right) で選択範囲を拡大する例です。

列 (ボックス) 選択

カーソルを 1 つの角に置き、Shift+Alt を押しながら反対側の角までドラッグします

macOS と Windows には列選択用のデフォルトのキーボード ショートカットもありますが、Linux にはありません。

必要であれば、keybindings.json を 編集 して、より使い慣れたキーに割り当てることができます。

列選択モード

ユーザー設定の Editor: Column Selection がこの機能を制御します。ステータス バーに表示されるようにこのモードに入ると、マウス ジェスチャと矢印キーでデフォルトで列選択が作成されるようになります。このグローバルな切り替えは、選択 > 列選択モード メニュー項目からもアクセスできます。さらに、ステータス バーから列選択モードを無効にすることもできます。

保存 / 自動保存

デフォルトでは、VS Code は変更をディスクに保存するために明示的なアクション ⌘S (Windows, Linux では Ctrl+S) を必要とします。

エディターに保存されていない変更がある場合、エディター タブにドットのインジケーターが表示され、エクスプローラー ビューには保存されていないファイルの数を示すバッジが表示されます。これらの変更はまだディスクには保存されていませんが、アプリケーションが予期せず終了した場合に復元できるように、VS Code は自動的にバックアップを作成します (ホット終了 を参照)。

ただし、設定した遅延時間の後や、フォーカスがエディターから離れたときに変更を保存する 自動保存 を簡単にオンにできます。このオプションをオンにすると、ファイルを明示的に保存する必要がなくなります。 自動保存 をオンにする最も簡単な方法は、遅延後の保存をオン/オフにする ファイル > 自動保存 の切り替えを使用することです。

自動保存 をさらに細かく制御するには、ユーザーまたはワークスペースの 設定 を開き、関連する設定を探します

• files.autoSave Open in VS Code Open in VS Code Insiders : 以下の値をとることができます
  • off - 自動保存を無効にします。
  • afterDelay - 設定された遅延時間の後にファイルを保存します (デフォルトは 1000 ミリ秒)。
  • onFocusChange - 編集中のファイルからエディターのフォーカスが外れたときにファイルを保存します。
  • onWindowChange - VS Code ウィンドウからフォーカスが外れたときにファイルを保存します。
• files.autoSaveDelay Open in VS Code Open in VS Code Insiders : files.autoSave Open in VS Code Open in VS Code Insiders が afterDelay に設定されている場合の遅延時間をミリ秒単位で設定します。デフォルトは 1000 ミリ秒です。

特定の言語やファイルタイプに対して 自動保存 機能をカスタマイズしたい場合は、 settings.json ファイルに言語固有のルールを追加することで行えます。

たとえば、LaTeX ファイルの 自動保存 を無効にするには

    "[latex]": {
        "files.autoSave": "off",
    },

ホット終了

デフォルトでは、VS Code は終了時にファイルの未保存の変更を記憶しています。ホット終了は、アプリケーションが ファイル > 終了 (macOS では Code > VS Code を終了) を介して閉じられたとき、または最後のウィンドウが閉じられたときにトリガーされます。

files.hotExit Open in VS Code Open in VS Code Insiders を以下の値に設定することで、ホット終了を設定できます

• "off": ホット終了を無効にします。
• "onExit": ホット終了はアプリケーションが閉じられたとき、つまり Windows/Linux で最後のウィンドウが閉じられたとき、または workbench.action.quit コマンドが (コマンド パレット、キーボード ショートカット、またはメニューから) トリガーされたときに実行されます。フォルダーが開かれていないすべてのウィンドウは、次回の起動時に復元されます。
• "onExitAndWindowClose": ホット終了は、アプリケーションが閉じられたとき (Windows/Linux で最後のウィンドウが閉じられたとき、または workbench.action.quit コマンドがトリガーされたとき) に加えて、最後のウィンドウであるかどうかに関わらず、フォルダーが開かれているすべてのウィンドウに対しても実行されます。フォルダーが開かれていないすべてのウィンドウは、次回の起動時に復元されます。フォルダー ウィンドウをシャットダウン前の状態に復元するには、 window.restoreWindows Open in VS Code Open in VS Code Insiders を all に設定します。

ホット終了で問題が発生した場合、すべてのバックアップは標準のインストール場所において以下のフォルダーに保存されています

• Windows %APPDATA%\Code\Backups
• macOS $HOME/Library/Application Support/Code/Backups
• Linux $HOME/.config/Code/Backups

検索と置換

VS Code では、現在開いているファイル内のテキストを素早く検索および置換できます。 ⌘F (Windows, Linux では Ctrl+F) を押してエディターで検索コントロールを開き、検索文字列を入力します。検索結果はエディター、概要ルーラー、およびミニマップにハイライト表示されます。

VS Code は、入力と同時に即座に検索を開始します。 Enter キーを押したときにのみ検索を開始するようにするには、 editor.find.findOnType Open in VS Code Open in VS Code Insiders 設定をオフにします。

一致箇所が見つかった後に検索コントロールを自動的に閉じ、エディターにフォーカスを戻すには、 editor.find.closeOnResult Open in VS Code Open in VS Code Insiders 設定を有効にします。

現在のファイル内に複数の一致箇所がある場合、検索入力ボックスにフォーカスがある状態で Enter を押すと次の結果へ、 ⇧Enter (Windows, Linux では Shift+Enter) を押すと前の結果へ移動します。

デフォルトでは、VS Code はワークスペースの検索と置換のクエリ履歴を保存し、再起動後も復元します。この動作は、 editor.find.history Open in VS Code Open in VS Code Insiders および editor.find.replaceHistory Open in VS Code Open in VS Code Insiders 設定で構成できます。履歴の保存を無効にするには、値を never に設定します。

選択範囲から検索文字列をシードする

検索コントロールを開くと、エディターで選択されているテキストが自動的に検索入力ボックスに入力されます。選択範囲が空の場合は、代わりにカーソル位置の単語が入力ボックスに挿入されます。

この機能は、 editor.find.seedSearchStringFromSelection Open in VS Code Open in VS Code Insiders を "never" に設定することでオフにできます。

選択範囲内を検索

デフォルトでは、検索操作はエディター内のファイル全体に対して実行されます。検索をテキストの選択範囲に限定するには、検索コントロールの 選択範囲内を検索 アイコンを選択するか、 ⌥⌘L (Windows, Linux では Alt+L) を押します。

これを検索コントロールのデフォルトの動作にしたい場合は、 editor.find.autoFindInSelection Open in VS Code Open in VS Code Insiders を always に設定するか、複数行の内容が選択されている場合にのみ選択範囲内を検索するように multiline に設定できます。

高度な検索と置換のオプション

より高度なシナリオのために、検索と置換のコントロールには以下のオプションがあります

• 検索コントロール

  • 大文字と小文字を区別する
  • 単語単位で一致させる
  • 正規表現

• 置換コントロール

  • 大文字と小文字を保持する

複数行のサポートと検索コントロールのリサイズ

検索入力ボックスや置換入力ボックスにテキストを貼り付けることで、複数行のテキストを検索できます。 Ctrl+Enter を押すと入力ボックス内に改行が挿入されます。

長いテキストを検索する場合、検索コントロールのデフォルトサイズでは小さすぎる場合があります。左側のサッシをドラッグして検索コントロールを拡大したり、左側のサッシをダブルクリックして最大化したり、デフォルトサイズに縮小したりできます。

ファイルをまたいだ検索

VS Code では、現在開いているフォルダー内のすべてのファイルを素早く検索できます。 ⇧⌘F (Windows, Linux では Ctrl+Shift+F) を押して検索語句を入力します。検索結果は検索語句を含むファイルごとにグループ化され、各ファイル内でのヒット数とその場所が表示されます。ファイルを展開すると、そのファイル内のすべてのヒット箇所のプレビューが表示されます。次に、いずれかのヒット箇所をシングルクリックすると、エディターでその場所が表示されます。

検索ボックスの右下にある省略記号 (検索詳細の切り替え) を選択する (または ⇧⌘J (Windows, Linux では Ctrl+Shift+J) を押す) ことで、高度な検索オプションを構成できます。これにより、検索を構成するための追加フィールドが表示されます。

高度な検索オプション

検索ボックスの下にある 2 つの入力ボックスに、検索対象に含める、または除外するパターンを入力できます。 example と入力すると、ワークスペース内の example という名前のすべてのフォルダーとファイルに一致します。 ./example と入力すると、ワークスペースのトップレベルにある example/ フォルダーに一致します。 , を使用して複数のパターンを区切ります。パスにはスラッシュ (/) を使用する必要があります。また、以下のような glob パターン 構文も使用できます

• * - パスセグメント内のゼロ個以上の文字に一致する
• ? - パスセグメント内の1文字に一致する
• ** - ゼロ個以上のパスセグメントに一致する
• {} 条件をグループ化します (例: {**/*.html,**/*.txt} はすべての HTML およびテキスト ファイルに一致します)
• [] 一致させる文字の範囲を 宣言 します (example.[0-9] は example.0、example.1、… に一致します)
• [!...] 一致させる文字の範囲を否定します (example.[!0-9] は example.a、example.b に一致しますが、 example.0 には一致しません)

大文字と小文字の区別に関する注意: glob パターンはオペレーティング システムのファイル システム ルールに従います。Windows と macOS では、パターンは大文字と小文字を区別しません (たとえば、 *.CS は file.cs に一致します)。Linux では、パターンは大文字と小文字を区別します。これは、検索テキスト自体の 大文字と小文字を区別する 切り替えとは別のもので、検索テキストが大文字と小文字を区別するかどうかを制御します。 glob パターン についての詳細はこちらをご覧ください。

VS Code は、興味のない検索結果の数を減らすために、デフォルトでいくつかのフォルダーを除外しています (例: node_modules)。 設定 を開き、 files.exclude Open in VS Code Open in VS Code Insiders および search.exclude Open in VS Code Open in VS Code Insiders セクションでこれらのルールを変更できます。

検索ビューでの glob パターンは、 files.exclude Open in VS Code Open in VS Code Insiders や search.exclude Open in VS Code Open in VS Code Insiders などの設定とは動作が異なることに注意してください。設定では、ワークスペース内のサブフォルダー folder1/example にある example という名前のフォルダーを一致させるために **/example を使用する必要があります。検索ビューでは、 ** プレフィックスが付いているものと想定されます。これらの設定における glob パターンは、常にワークスペース フォルダーのパスを基準にして評価されます。

また、除外するファイル ボックスにある 除外設定と無視ファイルを使用する 切り替えボタンにも注目してください。この切り替えにより、 .gitignore ファイルによって無視されているファイルや、 files.exclude Open in VS Code Open in VS Code Insiders および search.exclude Open in VS Code Open in VS Code Insiders 設定で一致したファイルを除外するかどうかが決まります。

含めるファイル ボックスでは、 変更されたファイル内のみを検索 切り替えボタンを使用して、ソース管理にコミットされていない変更があるファイルのみに検索結果を制限できます。リポジトリがない場合や検索対象に変更がない場合、この切り替えは無効になります。

検索と置換

ファイルをまたいだ検索と置換も可能です。検索ウィジェットを展開して置換テキスト ボックスを表示します。

置換テキスト ボックスにテキストを入力すると、保留中の変更の差分が表示されます。置換テキスト ボックスからすべてのファイルをまたいで置換したり、1 つのファイル内のすべてを置換したり、1 つの変更箇所だけを置換したりできます。

正規表現置換での大文字・小文字の変更

VS Code は、エディター内またはグローバルでの検索と置換の際に、正規表現の一致グループの大文字/小文字を変更することをサポートしています。これは修飾子 \u\U\l\L を使用して行います。 \u と \l は単一の文字を大文字/小文字に変換し、 \U と \L は一致グループの残りの部分を大文字/小文字に変換します。

例

修飾子は重ねることもできます。たとえば、 \u\u\u$1 はグループの最初の 3 文字を大文字にし、 \l\U$1 は最初の文字を小文字に、残りを大文字にします。キャプチャ グループは置換文字列内で $n によって参照されます (n はキャプチャ グループの順序です)。

検索エディター

検索エディターを使用すると、ワークスペースの検索結果をフルサイズのエディターで表示でき、構文ハイライトやオプションで前後数行のコンテキストも含めることができます。

以下は、'SearchEditor' という単語を検索し、コンテキストとして一致箇所の前後に 2 行のテキストを表示した例です

検索エディターを開く コマンドは、既存の検索エディターがあればそれを開き、なければ新しいエディターを作成します。 新しい検索エディター コマンドは常に新しい検索エディターを作成します。

検索エディターでは、 定義へ移動 アクションを使用して結果に移動できます。たとえば、 F12 を押すと現在のエディター グループでソースの場所が開き、 ⌘K F12 (Windows, Linux では Ctrl+K F12) を押すと横に並んだエディターで場所が開きます。さらに、 search.searchEditor.singleClickBehaviour Open in VS Code Open in VS Code Insiders および search.searchEditor.doubleClickBehaviour Open in VS Code Open in VS Code Insiders 設定で、検索結果のシングルクリックまたはダブルクリックの動作を構成できます。たとえば、定義のぞき見ウィンドウを開いたり、ソースの場所を開いたりするように設定できます。

検索ビューの上部にある 新しい検索エディターを開く ボタンを使用することもできます。また、結果ツリーの上部にある エディターで開く リンク、または 検索エディター: エディターで結果を開く コマンドを使用して、検索ビューから既存の結果を検索エディターにコピーできます。

上の検索エディターは、検索ビューの上部にある 新しい検索エディターを開く ボタン (3 番目のボタン) を選択して開かれました。

検索エディターのコマンドと引数

• search.action.openNewEditor - 新しいタブで検索エディターを開きます。
• search.action.openInEditor - 現在の検索結果を新しい検索エディターにコピーします。
• search.action.openNewEditorToSide - 現在開いているウィンドウの隣の新しいウィンドウで検索エディターを開きます。

検索エディター コマンド (search.action.openNewEditor、 search.action.openNewEditorToSide) に渡して、新しい検索エディターの動作を構成できるキーボード ショートカットの引数が 2 つあります

• triggerSearch - 検索エディターが開かれたときに自動的に検索を実行するかどうか。デフォルトは true です。
• focusResults - 検索結果にフォーカスを置くか、クエリ入力にフォーカスを置くか。デフォルトは true です。

たとえば、次のキーボード ショートカットは、検索エディターが開かれたときに検索を実行しますが、フォーカスは検索クエリ コントロールに残したままにします。

{
  "key": "ctrl+o",
  "command": "search.action.openNewEditor",
  "args": { "query": "VS Code", "triggerSearch": true, "focusResults": false }
}

検索エディターのコンテキストのデフォルト

search.searchEditor.defaultNumberOfContextLines Open in VS Code Open in VS Code Insiders 設定のデフォルト値は 1 です。これは、検索エディターの各結果行の前後に 1 行のコンテキスト行が表示されることを意味します。

前回の検索エディター設定を再利用する

search.searchEditor.reusePriorSearchConfiguration Open in VS Code Open in VS Code Insiders 設定 (デフォルトは false) を使用すると、新しい検索エディターを作成する際に、最後にアクティブだった検索エディターの構成を再利用できます。

IntelliSense

単語の補完は常に提供されますが、JavaScript、JSON、HTML、CSS、SCSS、Less、C#、TypeScript などのリッチな 言語 については、真の IntelliSense エクスペリエンスを提供します。言語サービスが可能的な補完を知っている場合、入力中に IntelliSense の提案がポップアップ表示されます。 ⌃Space (Windows, Linux では Ctrl+Space) を押して、いつでも手動でトリガーできます。デフォルトでは、 Tab または Enter が確定のキーボード トリガーですが、これらの キーボード ショートカットをカスタマイズ することもできます。

JavaScript および TypeScript の開発者は、 npmjs 型定義 (typings) ファイル リポジトリを利用して、一般的な JavaScript ライブラリ (Node.js、React、Angular) の IntelliSense を取得できます。型定義ファイルの使用に関する詳細な説明は、 JavaScript 言語 のトピックおよび Node.js チュートリアルにあります。

詳細は IntelliSense ドキュメント をご覧ください。

フォーマット

VS Code はソース コードの整形を強力にサポートしています。エディターには 2 つの明示的なフォーマット アクションがあります

• ドキュメントのフォーマット (⇧⌥F (Windows では Shift+Alt+F、Linux では Ctrl+Shift+I)) - アクティブなファイル全体を整形します。
• 選択範囲のフォーマット (⌘K ⌘F (Windows, Linux では Ctrl+K Ctrl+F)) - 選択したテキストを整形します。

これらは、 コマンド パレット (⇧⌘P (Windows, Linux では Ctrl+Shift+P)) またはエディターのコンテキスト メニューから呼び出すことができます。

VS Code には、JavaScript、TypeScript、JSON、HTML、CSS 用のデフォルトのフォーマッタが含まれています。各言語には固有のフォーマット オプション (例: html.format.indentInnerHtml Open in VS Code Open in VS Code Insiders ) があり、ユーザー設定やワークスペース 設定 で好みに合わせて調整できます。同じ言語に対してフォーマットを提供する別の拡張機能がインストールされている場合は、デフォルトの言語フォーマッタを無効にすることもできます。

"html.format.enable": false

コードの整形を手動で呼び出すだけでなく、入力、保存、貼り付けなどのユーザー ジェスチャに基づいてフォーマットをトリガーすることもできます。これらはデフォルトではオフになっていますが、以下の 設定 を通じて有効にできます

• editor.formatOnType Open in VS Code Open in VS Code Insiders - 入力後にその行を整形します。
• editor.formatOnSave Open in VS Code Open in VS Code Insiders - 保存時にファイルを整形します。
• editor.formatOnPaste Open in VS Code Open in VS Code Insiders - 貼り付けられた内容を整形します。

デフォルトのフォーマッタに加えて、マーケットプレイスで他の言語やフォーマット ツールをサポートする拡張機能を見つけることができます。 Formatters カテゴリがあるため、 フォーマット拡張機能 を簡単に検索して見つけることができます。 拡張機能 ビューの検索ボックスに 'formatters' または 'category:formatters' と入力すると、VS Code 内でフィルタリングされた拡張機能のリストが表示されます。

折りたたみ

行番号と行の先頭の間にあるガターの折りたたみアイコンを使用して、ソース コードのリージョンを折りたたむことができます。ガターの上にマウスを移動し、クリックしてリージョンを折りたたんだり展開したりします。折りたたみアイコンを Shift + クリック すると、そのリージョンとその中のすべてのリージョンを折りたたんだり展開したりできます。

以下の操作も使用できます

• 折りたたむ (⌥⌘[ (Windows, Linux では Ctrl+Shift+[)) は、カーソル位置にある最も内側の未崩落リージョンを折りたたみます。
• 展開する (⌥⌘] (Windows, Linux では Ctrl+Shift+])) は、カーソル位置にある折りたたまれたリージョンを展開します。
• 折りたたみの切り替え (⌘K ⌘L (Windows, Linux では Ctrl+K Ctrl+L)) は、カーソル位置のリージョンを折りたたむか展開します。
• 再帰的に折りたたむ (⌘K ⌘[ (Windows, Linux では Ctrl+K Ctrl+[)) は、カーソル位置にある最も内側の未崩落リージョンとその中のすべてのリージョンを折りたたみます。
• 再帰的に展開する (⌘K ⌘] (Windows, Linux では Ctrl+K Ctrl+])) は、カーソル位置のリージョンとその中のすべてのリージョンを展開します。
• すべて折りたたむ (⌘K ⌘0 (Windows, Linux では Ctrl+K Ctrl+0)) は、エディター内のすべてのリージョンを折りたたみます。
• すべて展開する (⌘K ⌘J (Windows, Linux では Ctrl+K Ctrl+J)) は、エディター内のすべてのリージョンを展開します。
• レベル X を折りたたむ (レベル 2 の場合は ⌘K ⌘2 (Windows, Linux では Ctrl+K Ctrl+2)) は、現在のカーソル位置にあるリージョンを除き、レベル X のすべてのリージョンを折りたたみます。
• すべてのブロック コメントを折りたたむ (⌘K ⌘/ (Windows, Linux では Ctrl+K Ctrl+/)) は、ブロック コメント トークンで始まるすべてのリージョンを折りたたみます。

折りたたみリージョンは、デフォルトでは行のインデントに基づいて評価されます。ある行が、それに続く 1 行以上の行よりもインデントが小さい場合に折りたたみリージョンが開始し、同じかそれ以下のインデントの行が現れたときに終了します。

折りたたみリージョンは、エディターで構成された言語の構文トークンに基づいて計算することもできます。Markdown、HTML、CSS、LESS、SCSS、JSON の各言語は、すでに構文を考慮した折りたたみを提供しています。

上記の言語のいずれか (またはすべて) でインデント ベースの折りたたみに戻したい場合は、以下を使用してください

  "[html]": {
    "editor.foldingStrategy": "indentation"
  },

リージョンは、各言語で定義されたマーカーによって定義することもできます。現在、以下の言語にマーカーが定義されています

マーカーによって定義されたリージョンのみを折りたたみ、展開するには、以下を使用します

• マーカー リージョンを折りたたむ (⌘K ⌘8 (Windows, Linux では Ctrl+K Ctrl+8)) は、すべてのマーカー リージョンを折りたたみます。
• マーカー リージョンを展開する (⌘K ⌘9 (Windows, Linux では Ctrl+K Ctrl+9)) は、すべてのマーカー リージョンを展開します。

選択範囲を折りたたむ

コマンド 選択範囲から手動折りたたみ範囲を作成 (⌘K ⌘, (Windows, Linux では Ctrl+K Ctrl+,)) は、現在選択されている行から折りたたみ範囲を作成し、それを折りたたみます。その範囲は、折りたたみプロバイダーによって計算された範囲の上に重ねられる 手動 折りたたみ範囲と呼ばれます。

手動折りたたみ範囲は、コマンド 手動折りたたみ範囲を削除 (⌘K ⌘. (Windows, Linux では Ctrl+K Ctrl+.)) で削除できます。

手動折りたたみ範囲は、プログラミング言語の折りたたみサポートがない場合に特に便利です。

インデント

VS Code では、テキストのインデント、およびスペースとタブ ストップのどちらを使用するかを制御できます。デフォルトでは、VS Code はスペースを挿入し、 Tab キーごとに 4 つのスペースを使用します。別のデフォルトを使用したい場合は、 editor.insertSpaces Open in VS Code Open in VS Code Insiders および editor.tabSize Open in VS Code Open in VS Code Insiders 設定 を変更できます。

    "editor.insertSpaces": true,
    "editor.tabSize": 4,

自動検出

VS Code は開いているファイルを分析し、ドキュメントで使用されているインデントを決定します。自動検出されたインデントは、デフォルトのインデント設定を上書きします。検出された設定はステータス バーの右側に表示されます。

ステータス バーのインデント表示をクリックすると、インデント コマンドを含むドロップダウンが表示され、開いているファイルのデフォルト設定を変更したり、タブ ストップとスペースの間で変換したりできます。

    "editor.detectIndentation": false,
    "editor.tabSize": 3,

ファイル エンコーディングのサポート

ユーザー設定 または ワークスペース設定 の files.encoding Open in VS Code Open in VS Code Insiders 設定を使用して、ファイルのエンコーディングをグローバルまたはワークスペースごとに設定します。

ステータス バーでファイルのエンコーディングを確認できます。

ステータス バーのエンコーディング ボタンをクリックして、アクティブなファイルを別のエンコーディングで開き直したり、保存したりします。

次にエンコーディングを選択します。

上書きモード

リリース 1.96 より前は、VS Code は Vim キーマップ拡張機能 をインストールしない限り、カーソル位置に文字が挿入される 挿入 モードのみをサポートしていました。

リリース 1.96 以降、VS Code は 上書き モードをサポートしています。これにより、カーソル位置に文字を挿入する代わりに、既存の文字を上書きできます。デフォルトでは、上書きモードはオフになっています。

挿入モードと上書きモードを切り替えるには、コマンド パレットで 上書き/挿入モードの切り替え コマンドを実行するか、(⌥⌘O (Windows, Linux では Insert)) を押します。上書きモードの場合、ステータス バーのインジケーターに OVR と表示されます。

editor.overtypeCursorStyle Open in VS Code Open in VS Code Insiders 設定を構成することで、上書きモードのカーソル スタイルを変更できます。

貼り付け時にテキストを上書きするには、 editor.overtypeOnPaste Open in VS Code Open in VS Code Insiders 設定を使用します。この設定を有効にするには、上書きモードである必要があります。

ファイルの比較

VS Code は、現在のファイルまたは任意の 2 つのファイルの内容を比較するいくつかの方法をサポートしています。

エディターでアクティブなファイルを開いている場合、以下の比較オプションがあります

• ワークスペース ファイルと比較: コマンド パレットで、 ファイル: アクティブ ファイルの比較対象... を選択し、比較する別のファイルを選択します。
• クリップボードと比較: コマンド パレットで、 ファイル: アクティブ ファイルとクリップボードを比較 (⌘K C (Windows, Linux では Ctrl+K C)) を選択して、現在のファイルとクリップボードの内容を比較します。
• 保存済みと比較: コマンド パレットで、 ファイル: アクティブ ファイルと保存済みを比較 (⌘K D (Windows, Linux では Ctrl+K D)) を選択して、現在のファイルと最後に保存されたバージョンを比較します。

任意の 2 つのファイルを比較するには

• エクスプローラー ビューでファイルを右クリックし、 比較対象に選択 を選択します。次に、2 番目のファイルを右クリックして、 選択項目と比較 を選択します。
• 2つの空のエディターウィンドウ間で比較を開始するには、コマンドパレットから **[ファイル: 新しい無題のテキスト ファイルを比較] (File: Compare New Untitled Text Files)** を選択します。

次のステップ

基本的なユーザーインターフェイスについては以上です。VS Code にはさらに多くの機能があります。続けて以下について確認してください。

• 紹介動画 - セットアップと基本 - VS Code の基本に関するチュートリアルをご覧ください。
• ユーザー/ワークスペース設定 - ユーザー設定とワークスペース設定を通じて、好みに合わせて VS Code を構成する方法を学びます。
• コードナビゲーション - プレビューや定義への移動など。
• 統合ターミナル - VS Code 内からコマンドラインタスクを迅速に実行するための統合ターミナルについて学びます。
• IntelliSense - VS Code はスマートなコード補完を提供します。
• デバッグ - ここで VS Code は真価を発揮します。

よくある質問

グローバルな検索と置換は可能ですか？

はい。検索ビューのテキストボックスを展開して、置換テキストフィールドを表示します。ワークスペース内のすべてのファイルを対象に検索と置換を行うことができます。フォルダーを指定せずに VS Code を開いた場合、検索は現在開いているファイルに対してのみ実行されることに注意してください。

折り返し（word wrap）をオンにするにはどうすればよいですか？

editor.wordWrap VS Code で開く VS Code Insiders で開く 設定で折り返しを制御できます。デフォルトでは、 editor.wordWrap VS Code で開く VS Code Insiders で開く は off ですが、これを on に設定すると、テキストはエディターの表示幅に合わせて折り返されます。

    "editor.wordWrap": "on"

⌥Z (Windows、Linux では Alt+Z) を使用して、現在の VS Code セッションの折り返しを切り替えることができます。

また、 editor.rulers VS Code で開く VS Code Insiders で開く 設定を使用して、エディターに垂直方向のルーラーを追加することもできます。この設定には、垂直ルーラーを表示したい列の文字位置の配列を指定します。

他のエディターと同様に、**切り取り**や**コピー**などのコマンドは、折り返された行全体に適用されます。トリプルクリックすると、折り返された行全体が選択されます。Home を 2 回押すと、カーソルが行の先頭に移動します。End を 2 回押すと、カーソルが行の末尾に移動します。

折り返された行で余分なカーソルが配置されないようにするにはどうすればよいですか？

現在の選択範囲の上下にカーソルを追加する際に行の折り返しを無視したい場合は、次のようにキーボードショートカットの args に { "logicalLine": true } を渡します。

{
  "key": "shift+alt+down",
  "command": "editor.action.insertCursorBelow",
  "when": "textInputFocus",
  "args": { "logicalLine": true },
},
{
  "key": "shift+alt+up",
  "command": "editor.action.insertCursorAbove",
  "when": "textInputFocus",
  "args": { "logicalLine": true },
},