vscodeとvimの良いとこ取り設定

vscodeとvimのいいとこどり設定

記事を書く経緯

まず自分のIDEの経歴からご紹介します

• sublime text 4ヶ月
• vim 3ヶ月
• vscode 5ヶ月
• lunarvim 5ヶ月
• vscode vim 6ヶ月

vim歴は約1年8ヶ月です。
vimmerになりたかった理由は『かっこいいから』です。
一時期lunarvimを使用していましたが、会社でvscodeを強要されたため仕方なくvscode vimを使っています。

vimの利点

かっこいいvimですが、かっこいいだけではないです。
全て『マスターすれば』の接頭辞が必要ですが、以下に利点を列挙します

• テキスト編集が速い
• マウスに触らなくて済む
• キーマップやプラグインのカスタマイズが自由
• terminal上で完結
• linux環境になっても動じない

以下はデメリットです

• LSP（「ここ構文エラーですよ」とか赤い波線で教えてくれるやつ）がデフォルトで備わってない
• プラグイン多すぎて何使っていいか分からない
• カスタマイズにこだわりすぎて時間が溶ける

キーマップ編集は好きですが、何のプラグインを入れるかは正直便利ならなんでもよかったので、lunarvimに手を出した経緯があります。
しかし、LiveShare必須になりvscodeを使わざるを得ない環境になったので、今はvscodeです。。

vscodeの利点

• LSPがデフォルト装備
• プラグイン（拡張機能）がすぐ追加できる
• 一部の拡張機能は、会社で必須だったりする（LiveShareなど）
• 一画面内にターミナル、デバッグ操作が可能
• 普通のエディタにない（？）便利な操作が可能（シンボル、{}や''に合わせて選択範囲を拡大など）
• ↑↑の便利機能を含めてショートカットキーのカスタムが可能
• みんな使ってる
• 他の人と同じ拡張機能を追加できる

デメリットは以下だと思ってます

• 長いコードの編集にはマウス操作は必要
• 起動が遅い、動きが重いこともある（pcスペックによるが、vimよりは絶対遅くなる）

vsCode Vimのメリット

vscodeの拡張機能「vsCode Vim」を追加することで、vsCode上である程度のvim操作が可能になります。
これによりマウスを使わずに速いテキスト編集が可能になります。
さらに、vsCodeの利点はそのまま生きるので、便利機能を使い続けることが可能です。

また、一部のデフォルトのショートカットキーは、vimと競合することがあるため、編集が必要です。
vscodeのデフォルトはほぼ全ての修飾キー+文字にショートカットキーが設定されてる気がします（ちゃんと確認してないけど、多分Ctrl+oとか）

以下に、vscodeの便利機能でよく使うショートカットキーを上げていきます
※"<Leader>"はvimの設定です。自分はスペースです。

ショートカットキー	操作	vscodeの変数名	使うタイミング
"<Leader>", "s"	ファイル内シンボル検索	workbench.action.gotoSymbol	今開いてるファイルの中の関数名覚えてるけどどこだっけ？
"<Leader>", "r"	カーソル上のシンボルをリネーム	editor.action.rename	すべてのファイルにある変数名を一括で変更したい

（その他、copilotのショートカットなど）

設定方法

設定の仕方は2種類あります。

1. settings.json
   settings.jsonに設定する場合、beforeに入力キーを入れます。
   そのあと、afterかcommandsのキーを入れます。
   別の入力キーに設定したい場合はafterを、vscodeのコマンドを使いたい場合はcommandsを使います。

settings.json

"vim.normalModeKeyBindings": 
    // ズーム
    {
      "before": ["<leader>", "-"],
      "commands": ["workbench.action.zoomOut"]
    }, // 縮小
    {
      "before": ["<leader>", "+"],
      "commands": ["workbench.action.zoomIn"]
    }, // 拡大
    {
      "before": ["<leader>", "0"],
      "commands": ["workbench.action.zoomReset"]
    }, // リセット
    {
      "after": ["<leader>", "<leader>", "2", "s", "<char>", "<char>"],
      "before": ["s"]
    }, // easymotion2文字->s
    
    // 改行してもノーマルモード
    {
      "after": ["o", "<ESC>"],
      "before": ["o"]
    },
    {
      "after": ["O", "<ESC>"],
      "before": ["O"]
    },
    // ウィンドウ系
    {
      "before": ["<enter>", "<enter>"],
      "commands": ["workbench.action.focusNextGroup"]
    }, // 隣のウィンドウに移動

commandsに入る内容は、

• コマンドパレット→「キーボードショートカットの切り替えのトラブルシューティング」で出力を開く→使いたいショートカットを使ってみる→出力される
• vscodeのリファレンスを探す
  で確認できます。

1. keyboard.json
   コマンドパレット→「キーボードショートカットを開く」で開けます。
   ここでキーボードショートカット設定した内容が一覧できます。

keyboard.json

// ctrl+矢印でサイドバー・エディター・ターミナル移動
  {
    "key": "ctrl+up",
    "command": "workbench.action.focusActiveEditorGroup",
    "when": "terminalFocus"
  },
  {
    "key": "ctrl+k",
    "command": "-workbench.action.focusActiveEditorGroup",
    "when": "terminalFocus"
  },
  {
    "key": "ctrl+right",
    "command": "workbench.action.focusActiveEditorGroup",
    "when": "sideBarFocus"
  },
  {
    "key": "ctrl+l",
    "command": "-workbench.action.focusActiveEditorGroup",
    "when": "sideBarFocus"
  },

commandの値が"-"で始まっているものは、デフォルトから別のショートカットに変更した時、「使えないショートカット」として設定されている場合に入ります。

注意点

vimの編集を一つ戻す（ノーマルモードでu）とvscodeの戻す（ctrl+z）で変な挙動になることがあります。
設定で統一するか、使用するコマンドをどちらかに統一する必要があります。

次に書こうとしてること

自分がvscode vimで設定している内容を書いていこうと思います。
カスタマイズが好きなので、ちょこちょこ変更されることはあるかと思いますが。。