vscode tips(適宜更新)

概要

vscodeのインストールを自動化してどの環境でも簡単に設定できるようにしたい。

extensionはUIのマーケットプレイスからしかインストールしたことなかったので、chefやansibleなどでextensionのインストールの自動化ってどうやってするのかなと思い調査。

install方法

% code --install-extension <extension id>

でインストールはcliからすることができる模様。
ちなみにextension idはUnique Identifierの事を指しているようでpackage.jsonのpublisher.nameで生成されている(気がする)。
複数インストールしたい場合

% code --install-extension <extension id> --install-extension <extension id2>

のように指定する必要が今のところある模様(1.21.0)

ちなみに既存のインストールされているextensionのリストは

code --list-extensions

確認できる。

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

公式
https://vscode-doc-jp.github.io/docs/getstarted/keybindings.html

画面の分割と統合

分割 : cmd + \　, command: workbench.action.splitEditor
結合 : 2つのグループのエディタを結合 -> defaultでは特に定義されていないので自分で設定して(自分はcmd + ') command: workbench.action.joinTwoGroups

画面移動系

cmd + option + ←→: 画面移動

タグジャンプ

定義先へジャンプ : cmd + click
定義から使用されている所へジャンプ(正確にはすべての参照先を検索) : shift+f12, command: editor.action.referenceSearch.trigger
ソースを移動した後移動元へに戻る: ctrl + -
逆に戻る: ctrl + shift + -
workbench.action.navigateForward

見た目をいい感じにする調整

パンくずリスト: breadcrumbs.enabledをtrue

以前いたファイルに戻る

タグジャンプしたあとに元いたページに戻りたい時が結構ある。
戻る: workbench.action.navigateBack
進む: workbench.action.navigateForward

Docker Extension on リモートホスト(Linux)

vscode 1.35以上対応

remote developmentについては記載しない。

vscodeではDockerのimageやcontainerなどがvscode上を管理できる拡張をmsが提供している。

1.35未満では対象はローカルホストのみであったが、remote developmentが導入されてリモートのdockerdを管理できるようになった。下記に適用方法を記載する。

• remoteにdocker extensionをインストールする。
• settings.json(ユーザー設定)に下記設定を追加する。

settings.json

"remote.extensionKind": {
    "ms-azuretools.vscode-docker": "workspace"
  }

• リモートホストのdockerdを一般ユーザー(sshでアクセスするユーザー)からアクセス可能にする。
  • Post-installation steps for Linux

自分の環境(CentOS7)の場合更にリモートホストを再起動しなくちゃだめだったけど上の設定をすればリモートホストdockerdをvscodeから操作することができた。

参考リンク

公式のドキュメントに普通に書いてあった。
https://code.visualstudio.com/docs/editor/extension-gallery#_browse-and-install-extensions
はぁまたインターネッツに重複した情報を流してしまった。。。