code/vscode

/

code/vscodeの使い方

タグ code-server code

概要

  • 人気のエディタ
  • ウェブブラウザで動作するcode-serverというバージョンもある
  • 呼び方はvscodeやcode、code-serverなど様々
  • 設定はワークスペースという単位で管理を行う
    • ワークスペースの配下にfoo.code-workspaceというファイルを作成して設定を記述する

installs

macOS

$ brew install visual-studio-code

windows

> scoop install vscode

設定ファイルのパス

macOS

$ ls $HOME/Library/Application\ Support/Code/User/settings.json

vscodeの基本的な使い方

open command pallet(showCommand)

  • ctrl+shift+p or cmd+shift+p

open terminal

  • ctrl+backquate

マークダウンプレビュー

  • cmd+kを押した後にすぐにv
  • 数式はLatexが対応している

color themeを変える

  • ctrl+shift+pでcolor themeを探して上下ボタンで好きな色をハイライトすると、動的に適応されるので、好きなcolor themeを選んでエンターで決定

vscodeの必須なプラグイン

Vim

  • 概要
    • vscodeでvimの操作を再現するプラグイン
  • 機能
    • foldingをサポートする
      • zcでオブジェクトを閉じる
      • zoでオブジェクトを開く
      • zaでオブジェクトをトグルする
    • foldingでカーソル移動する際はsettings.jsonに"vim.foldfix": trueに追加する
  • 留意点
    • 多くの機能は意図通りに動くが、normalモードでマウスを使用したときにcursorのポジションが変化してしまう
      • issueでも議論さているが、解決法は提示されていない

Remote - SSH

  • 概要
    • sshで接続した先のファイルシステムを対象に操作するもの
  • 機能
    • ~/.ssh/configに記されたホストに接続できる
    • 左下に接続を開始するアイコンがでる
    • terminalでvimで操作するより応答がいいので(ローカルのキャッシュを利用するので)、遅いサーバに対してファイルを編集する必要がある際に便利
    • リモートに環境を自動でインストールするようで、デバッグ等もできる
    • 接続が切れた際に再度自動再接続する機能がある

microsoftアカウントとvscodeの設定を紐付ける

  • 左下の人間のアイコンをクリック
  • microsoftアカウントでログイン

リモートのワークスペースを開く

$ code --remote ssh-remote+<hostname> /your/path/to/foo.code-workspace

トラブルシューティング

vimモードで操作しているときhjklキーをリピートして移動できない

使用しているshortcutの設定

  • command palletでshortcutで検索してキーボードショートカットを開く(JSON)を探す
[
    {
        // macだとバグって操作が受け付けないことがある
        // 左のタブへの意味
        "key": "ctrl+[",
        "command": "workbench.action.previousEditorInGroup",
        "when": "editorTextFocus"
    },
    {
        // 右のタブへの意味
        "key": "ctrl+]",
        "command": "workbench.action.nextEditorInGroup",
        "when": "editorTextFocus"
    },
    ,{
        "key": "ctrl+o",
        "command": "workbench.action.files.openFile",
        "when": "editorTextFocus"
    }
]