【VSCode】設定を表示する方法と、設定画面について|設定IDでの検索など

Visual Studio Code(以下、VSCodeと表記)は、Windows・Macなどで利用できる無料ソースコードエディタ。

今回は、そのVSCodeの設定変更をできる画面を表示する方法と、その設定画面についてのまとめとなります。

また、記事内のVSCodeに関する表記は、拡張機能「Japanese Language Pack」でVSCodeを日本語化した場合の表記となります。

VSCodeの設定を表示する方法

VSCodeの設定画面は、タブとして以下の手順で表示できます。

  1. VSCodeの画面左下にある歯車アイコンをクリックします。
    VSCodeの画面左下にある歯車アイコンの画像
  2. 表示されるメニューから「設定」を選択します。VSCodeの画面左下にある歯車アイコンを選択した状態の画像

上記手順により、VSCodeの設定がタブとして表示できます。

設定を表示するショートカットキー

また、設定のタブは以下のショートカットキーでも表示できます。

Maccommand + , 
WindowsCtrl + ,

設定の画面について

上記手順により表示した設定画面では、右カラムに、項目ごとによって順番に設定の内容が表示され、変更するには、それらの設定の値を変更します。

また、左カラムには項目ごとのメニューがあり、そのメニューからそれぞれの項目の先頭へ移動できます。

VSCodeの設定タブの画像
VSCodeの設定画面。

設定を検索

また、設定画面の上部にある検索ボックスに、設定の内容に記載されている文字列の一部を入力して検索することで、表示する設定を絞り込むことができます。

設定タブ内の検索ボックスから「フォント」を検索した状態の画像
設定画面内の検索ボックスから「フォント」を検索した状態。設定の内容に「フォント」の記載がある設定のみが表示されます。

設定IDによる検索

VSCodeでは、それぞれの設定に設定IDがあり、そのIDを設定タブ内の検索ボックスに入力して、設定を検索することも可能です。

フォントサイズの設定ID「editor.fontSize」で検索した状態の画像
「フォントサイズ」の設定ID「editor.fontSize」で検索した状態

設定IDは以下の手順でコピーすることができます。

  1. 右カラム内の設定から、設定IDをコピーしたい設定名をマウスオーバーします。
    フォントサイズの設定名をマウスオーバーした状態の画面
    「フォントサイズ」の設定名「Editor.: Font Size」をマウスオーバーした状態
  2. 歯車アイコンが表示されるので、クリックするとメニューが表示されるので、「設定IDをコピー」を選択します。
    設定名の横に表示される歯車アイコンをクリックした状態の画像
    設定名の横に表示される歯車アイコンをクリックした状態

上記手順により、設定IDをコピーできます。

設定を適用する範囲を変更

VSCodeでは設定変更を適用する範囲を、以下の範囲で変更できます。

  • ユーザー(VSCode全体)
  • ワークスペース(ワークスペースごと)
  • フォルダ(ワークスペース直下のフォルダごと)

設定変更を適用する範囲は、検索ボックスの下にあるタブで変更でき、設定を変更した場合、そのタブで選択している範囲の設定が変更されます。

設定タブ内にある設定変更を適用する範囲を変更するタブの画像
設定変更を適用する範囲を変更するタブ。

設定変更を管理するJSONファイルについて

VSCodeでは設定を変更すると、設定変更を管理するJSONファイルにオブジェクトの要素が追加されます。

また、そのJSONファイルを直接編集して設定変更を行うことも可能です。

設定変更を管理するJSONファイルを開く方法については、以下のリンク先を参考にしてみてください。

コメント投稿コメント投稿欄を開く

コメントは項目欄(*は必須項目)を入力し、「コメントを送信」ボタンをクリックしてください。 (メールアドレスは公開されることはありません。コメントの公開は承認制となります。)

また、多忙によりコメントには返信できない場合があります。

Twitterで返信する場合はこちらから。