VSCode 使いやすくした

VSCode作業効率化

VSCodeを使いやすくして作業効率化をはかってみた。

改善したかった項目

1. 1画面でコマンド操作も完結させたい
2. トラックパッド使いたくない
3. ワークスペースを開くときにメニューから行くのがだるい
4. 作業ファイルパスの閲覧性を上げる

1. 1画面でコマンド操作も完結させたい

ビルドするたびにターミナルに移動するのがめんどくさいので、
VSCode内でターミナルを開く。

・ ターミナル起動ショートカット

⇧shift + ^control + '

・ 画面下部にターミナルが現れる

2. トラックパッド使いたくない

画面内で移動するときにいちいちトラックパッドに行くのが面倒なので、
キーバインドを設定。
移動したい場所は、「サイドバー」「エディター」「ターミナル」間。

・ キーバインド設定開く

⌘command K + ⌘command S

・ keybindings.jsonにカスタマイズを追加

vimが好きな人で 「H,J,K,L」を使用している人もいたが、自分はウィンドウ移動に使っているため「A,S,D」を使用した。

keybindings.json

// Place your key bindings in this file to override the defaults
[
  {
    "key": "ctrl+a",
    "command": "workbench.action.focusSideBar",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+a",
    "command": "workbench.action.focusSideBar",
    "when": "terminalFocus"
  },
  {
    "key": "ctrl+s",
    "command": "workbench.action.focusFirstEditorGroup",
    "when": "filesExplorerFocus"
  },
  {
    "key": "ctrl+s",
    "command": "workbench.action.focusFirstEditorGroup",
    "when": "terminalFocus"
  },
  {
    "key": "ctrl+d",
    "command": "workbench.action.terminal.focus",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+d",
    "command": "workbench.action.terminal.focus",
    "when": "filesExplorerFocus"
  }
]

3. ワークスペースを開くときにメニューから行くのがだるい

要するにここ（↓）から開くのがめんどくさいので、コマンドで開く。

・ code コマンドを使用可能にする

⌘command + ⇧shift + P でコマンドパレットを開く。
「shell」と入力。

これをインストールするcodeコマンドが使えるようになる。

・ codeコマンドでワークスペースを開く

カレントディレクトリを新しいwindowで開く

code .

ファイルもしくはディレクトリを指定して新しいwindowで開く

code "file name or directory name"

・ オプション(便利)

-aで同じワークスペース内で開く（※マルチワークスペース）、ファイルやディレクトリの追加

code -a .

code -a "file name or directory name"

その他オプションはこちら↓
The Visual Studio Code Command Line Options

4. 作業ファイルパスの閲覧性を上げる

どこのファイルをいじっているのか、VSCodeはサイドバーではわかりにくい（特にサイドバーの幅が狭いくて階層の深いファイルをいじっている時）ので、
階層を可視化。

・ コマンドパレットを開く

「Toggle Breadcrumbs」 入力。

・ ファイルパスがパンくずリストで表示される

※ちょっと関連すること
windowのタイトルの表示をカスタム。

${folderPath}${separator}${activeEditorShort}${separator}${rootName}

⌘command + , で設定を開いて、「ウィンドウ＞Title」で設定可能。
windowの上部の表示がこうなる↓

---

おわり。
環境の共有もやってみた。

参考：
【VSCode】エディタ、サイドバー、ターミナル間のフォーカスのショートカットを設定する - Qiita
The Visual Studio Code Command Line Options