はじめに
こんにちは。普段はNeoVimで開発していますがふとVSCodeで開発したい場面が出てきたので、設定した内容を書いていきます。
ちなみにNeoVimは、プラグインを90個ほど入れているのでそのプラグインの機能を実現することにも着目していきます。
なお機能によって、setting.jsonに書くか、keybindings.jsonに書くかが変わるので、ファイル名で区別してください。
基本的な設定
まず以下のVSCodeのextensionを入れます。これで大体のVimの機能は入ります。
後は、extensionを入れると付いてくるplugin達を有効にしていきましょう。
// vim plugins
"vim.easymotion": true,
"vim.surround": true,
"vim.sneak": true,
"vim.camelCaseMotion.enable": true,
"vim.replaceWithRegister": true,
使い方はREADMEに書いてあるので詳しくは触れませんが、普段Vimを利用している人は大体入っているpluginが多いかなと思います。
後は細かい設定をしていきます。
// common config
"vim.visualstar": true, // * で検索できるようにする
"vim.useSystemClipboard": true, // クリップボードを利用できるように
"vim.useCtrlKeys": true,
"vim.hlsearch": true,
"vim.incsearch": true,
"vim.highlightedyank.enable": true, // vim-highlightedyankと同じ機能
"vim.highlightedyank.duration": 500,
"vim.leader": "<space>", // leaderキーを設定
Tabをやめて、Bufferライクな操作感を実現する
まずTabは基本的に利用しないので、機能自体をoffにします。
Tabを利用したい人もいるとは思うのですが、自分が今どれくらいのファイルを開いているのかがわからない点が個人的にきついので、Tabは利用しません。
// tabs
"workbench.editor.tabSizing": "shrink",
"workbench.editor.tabCloseButton": "off",
"workbench.editor.showTabs": false,
そして以下の拡張を入れて、直近開いたファイルから検索をする形式を取ります。
僕は以下のように設定をしています。
"vim.normalModeKeyBindingsNonRecursive": [
{
"before": ["<leader>", ";"],
"commands": ["extension.openRecentFiles"]
}
]
leader + ; で直近開いたファイルのリストが開きます。
register 0の内容をpasteする
VSCodeでも同様の処理ができそうだったので、そのまま以下のように追加しました。
ちなみに0には、yankした内容が入っておりdeleteした内容は1から順番に入っていくので、常にyankされた内容をペーストできます。
// visual modeのkeymapにも加えとくと楽です
"vim.normalModeKeyBindingsNonRecursive": [
// paste 0 register
{
"before": ["<leader>", "p"],
"after": ["\"", "0", "p"]
},
{
"before": ["<leader>", "P"],
"after": ["\"", "0", "P"]
}
]
ファイル検索、プロジェクト内検索
Vimを利用している時、ファイルを開いたりプロジェクト内を全部検索したりするのはFZFを利用していたのですが、VSCodeではデフォルトのものを利用しようと思います。
以下のように設定をしました。
"vim.normalModeKeyBindingsNonRecursive": [
{
"before": ["<leader>", "t"],
"commands": ["workbench.action.quickOpen"]
},
{
"before": ["<leader>", "a"],
"commands": ["workbench.action.findInFiles"],
"when": ["!searchInputBoxFocus"]
},
]
検索サイドバー内でも、デフォルトでjkなどで動けるようなのでそこまで不自由はしないかなと思いました。
File Explorerを開く
NeoVimでは<Leader> + d で defx.nvimというFile Explorerを開くようにしていたので、VSCodeでも同じようにしました。
"vim.normalModeKeyBindingsNonRecursive": [
{
"before": ["<leader>", "d"],
"commands": ["workbench.view.explorer"]
}
]
VSCodeのFile Explorerもhjklで移動できるので、使用感はそこまで変わらずに使用できました。
vscode-accelerated
accelerated-jk と同等のものがVSCodeにあったので、以下のものを入れました。
設定はREADMEに書かれているので、それを書いたら動くと思います。
vscode-partial-diff
linediff.vim と使用感は少し違いますが使いやすそうな、Partial Diffを利用しました。
そしてREADMEに書かれていますが、以下のような設定をしました。
[
// Partial Diff
{
"key": "ctrl+1",
"command": "extension.partialDiff.markSection1",
"when": "editorTextFocus"
},
{
"key": "ctrl+2",
"command": "extension.partialDiff.markSection2AndTakeDiff",
"when": "editorTextFocus"
},
]
tips: VSCodeのextensionを管理する
project rootに.vscode/extension.jsonを置くと、projectごとにinstallするextensionを管理できるらしいが、普段使いする際には一回installしてしまえば良いので、今回はCLIでinstallをします。
参考: https://code.visualstudio.com/docs/editor/extension-gallery
以下のようにMakefileを定義してやって、vscode_extensions.txtを更新してやるようにしました。
update_vscode_extension:
rm script/vscode_extensions.txt && code --list-extensions > script/vscode_extensions.txt
そして実際にinstallする時は以下のようなscriptを利用して、installします。
cat './script/vscode_extensions.txt' | xargs -I% code --install-extension %
終わりに
VSCodeでの開発に少し抵抗感があったのですが、そこまでpluginなど入れなくても普段使いのVimに近づけるんだなと感動しました。
欲を言うと、検索だったりターミナルをfloating windowで頼みたいがさすがに無理っぽい
参考: https://oita.oika.me/2018/12/14/vscode-floating-window/
設定ファイルは一式は以下の箇所に置いています。
https://github.com/mitubaEX/dotfiles/tree/master/.config/Code/User
非常に参考になった記事
大体の設定は以下にあるので、適宜もらっていってください