はじめに
Visual Studio Code(以下、VSCode)で設定した内容について、書き残していきます。
普段はサクラエディタを使っていて、開発環境はVSCodeを使っているので、VSCodeは初心者です。
私は、サクラエディタでは、ウィンドウを縦横4分割して使う場合が多いです。ファイル内の他のコードを参照しながら実装することが多いからです。
過去にVSCodeに移行しようとしたとき、ウィンドウ分割、解除、アクティブウィンドウの移動あたりのキーバインドが分からずに挫折したことがあります(笑)。今回は絶対に移行します!
この記事は、完全に自分用のメモになりそうです。でも、他の人の設定って気になりますよね、全部公開します(笑)。
この記事は随時更新する予定です!
参考文献
設定ファイルの場所
Windowsの場合の設定ファイルの場所:%APPDATA%\Code\User\settings.json
Linuxの場合の設定ファイルの場所:$HOME/.config/Code/User/settings.json
%APPDATA%
は、通常、C:\Users\xxx\AppData\Roaming
となっています
- VSCode は、インストール直後の状態では、
settings.json
が作られていない
- VSCode には、規定の設定があり、変更した内容が
settings.json
に追記される
- キーボードショートカット(キーバインド)の設定ファイル
keybindings.json
も同じ場所に作られる
設定
フォント
拡張機能
日本語化
- 拡張機能から
japanese
と入力して「Japanese Language Pack for Visual Studio Code」をインストールする
- コマンドパレット(F1キー):「Configure Display Language」で日本語を選択する
code-eol:改行コードを表示する機能
- settings.json の "code-eol.color" を "#555" に設定する
Zenkaku:全角空白を表示する機能
- コマンドパレット(F1キー):「Enable Zenkaku」で有効化する
PlantUML:テキストでUMLの図を書く機能
- PlantUMLで図のテキストを書いたら、コマンドパレット(F1キー)で、「PlantUML: Preview CurrentDiagram」でプレビューが見れる
VSCodeの便利と思った機能
- HTML/CSSファイルの整形機能:対象のHTML/CSSファイルを開いて、右クリック→ドキュメントのフォーマット
- カラーコードの可視化:CSSファイルを開くと、カラーコードの前に、その色が表示され、マウスをかざすとカラーを変更できる(下図)
未解決な問題(解決済み含む)
- ウィンドウ分割時のアクティブウィンドウの変更(分割ウィンドウの移動)
- Ctrl+1、Ctrl+2、Ctrl+3で移動できました
- 左側のサイドバー(プライマリ)の開閉トグルは、デフォルト Ctrl+B(キーがかぶってるので、Ctrl+Shift+Bに変更)
キーボードショートカット(キーバインド)
設定した内容は、と同じディレクトリに keybindings.json
として保存されます。
設定した内容を貼り付けます。
"command"で、"-"が付いているのは、そのキーに、もともと割り当てられていた機能を削除したという意味です。
[
{
"command": "workbench.action.showAllSymbols",
"key": "ctrl+alt+t"
},
{
"command": "-workbench.action.showAllSymbols",
"key": "ctrl+t"
},
{
"command": "actions.find",
"key": "ctrl+t"
},
{
"command": "-actions.find",
"key": "ctrl+f"
},
{
"command": "cursorRight",
"key": "ctrl+f",
"when": "textInputFocus"
},
{
"key": "ctrl+shift+b",
"command": "workbench.action.toggleSidebarVisibility"
}
{
"command": "-workbench.action.toggleSidebarVisibility",
"key": "ctrl+b"
},
{
"command": "cursorLeft",
"key": "ctrl+b",
"when": "textInputFocus"
},
{
"command": "-workbench.action.quickOpen",
"key": "ctrl+p"
},
{
"command": "cursorUp",
"key": "ctrl+p",
"when": "textInputFocus"
},
{
"command": "-workbench.action.showCommands",
"key": "ctrl+shift+p"
},
{
"command": "scrollLineUp",
"key": "ctrl+shift+p",
"when": "textInputFocus"
},
{
"command": "-workbench.action.files.newUntitledFile",
"key": "ctrl+n"
},
{
"command": "cursorDown",
"key": "ctrl+n",
"when": "textInputFocus"
},
{
"command": "-workbench.action.newWindow",
"key": "ctrl+shift+n"
},
{
"command": "scrollLineDown",
"key": "ctrl+shift+n",
"when": "textInputFocus"
},
{
"command": "-editor.action.selectAll",
"key": "ctrl+a"
},
{
"command": "cursorHome",
"key": "ctrl+a",
"when": "textInputFocus"
},
{
"command": "-workbench.action.quickOpen",
"key": "ctrl+e"
},
{
"command": "cursorEnd",
"key": "ctrl+e",
"when": "textInputFocus"
},
{
"command": "-cursorUndo",
"key": "ctrl+u",
"when": "textInputFocus"
},
{
"command": "cursorPageUp",
"key": "ctrl+u",
"when": "textInputFocus"
},
{
"command": "-editor.action.toggleTabFocusMode",
"key": "ctrl+m"
},
{
"command": "cursorPageDown",
"key": "ctrl+m",
"when": "textInputFocus"
},
{
"command": "-editor.action.outdentLines",
"key": "ctrl+oem_4",
"when": "editorTextFocus && !editorReadonly"
},
{
"command": "cursorTop",
"key": "ctrl+oem_4",
"when": "textInputFocus"
},
{
"command": "-editor.action.indentLines",
"key": "ctrl+oem_6",
"when": "editorTextFocus && !editorReadonly"
},
{
"command": "cursorBottom",
"key": "ctrl+oem_6",
"when": "textInputFocus"
},
{
"command": "editor.action.selectAll",
"key": "ctrl+oem_7"
},
{
"command": "-workbench.action.terminal.toggleTerminal",
"key": "ctrl+oem_3"
},
{
"command": "cursorDownSelect",
"key": "ctrl+oem_3",
"when": "textInputFocus"
},
{
"command": "cursorUpSelect",
"key": "ctrl+i",
"when": "textInputFocus"
},
{
"command": "cursorRightSelect",
"key": "ctrl+k",
"when": "textInputFocus"
},
{
"command": "-workbench.action.togglePanel",
"key": "ctrl+j"
},
{
"command": "cursorLeftSelect",
"key": "ctrl+j",
"when": "textInputFocus"
},
{
"command": "-editor.action.addSelectionToNextFindMatch",
"key": "ctrl+d",
"when": "editorFocus"
},
{
"command": "deleteRight",
"key": "ctrl+d",
"when": "textInputFocus"
},
{
"command": "-expandLineSelection",
"key": "ctrl+l",
"when": "textInputFocus"
},
{
"command": "editor.action.deleteLines",
"key": "ctrl+l",
"when": "textInputFocus && !editorReadonly"
},
{
"command": "-editor.action.deleteLines",
"key": "ctrl+shift+k",
"when": "textInputFocus && !editorReadonly"
},
{
"command": "-workbench.action.splitEditor",
"key": "ctrl+oem_5"
},
{
"command": "editor.action.fontZoomReset",
"key": "ctrl+oem_5"
},
{
"command": "editor.debug.action.toggleBreakpoint",
"key": "shift+f9",
"when": "editorTextFocus"
},
{
"command": "-editor.debug.action.toggleBreakpoint",
"key": "f9",
"when": "editorTextFocus"
},
{
"command": "workbench.action.splitEditorDown",
"key": "f9"
},
{
"command": "workbench.action.splitEditorRight",
"key": "ctrl+f9"
}
]
おわりに
まずは、初期設定が終わったという程度ですが、参考文献の本を読みながら、少しずつカスタマイズしていこうと思います。
今回は以上です!
最後までお読みいただき、ありがとうございました。