🤖

vscodeのワークスペースを色分けしてスイッチできる拡張が便利

2020/10/24に公開

はじめに

vscodeで複数のワークスペースを切り替えながら作業する時、今自分がどのワークスペースを開いているのかわからなくなったり、いちいちミッションコントロールを起動して画面を切り替えるのが面倒だったりしないでしょうか。
vscode-workspace-switcherを導入すれば、こんな感じで解決します。

各ワークスペースの左端のバーの色を替えてワークスペースを識別しやすくし、ショートカットキーでワークスペースを切り替えられるようになります。

導入と設定

1.vscode-workspace-switcherをインストール
2.ターミナルからvscodeを起動するコマンドcodeをインストール。参考記事
3.切り替えたいフォルダの.code-workspaceファイルを作成。vscode上でワークスペースに追加したいフォルダを開いた状態で「メニュー→ファイル→名前を付けてワークスペースを保存」を選び、任意のフォルダに保存する。
4.vscodeの設定ファイルsetting.jsonを開き、以下を追加

  "vscodeWorkspaceSwitcher.paths": ["/path/to/3で.code-workspaceファイルを保存したフォルダ/"],

この時点で、vscode左端のバーのvscode-workspace-switcherのアイコンや、Ctrl-wで各ワークスペースを切り替えられるようになっているはずです。
5.各.code-workspaceファイルに以下を追記。色の指定を変更すれば任意の色にできます。

{
  "settings": {
    "workbench.colorCustomizations": {
      "activityBarBadge.background": "#4aa1c4",
      "activityBar.background": "#4aa1c4",
      "activityBar.foreground": "#000000"
    }
  }
}

はじめに

導入と設定

Discussion