Posted at

優柔不断VimmerのVSCodeVim


優柔不断VimmerのVSCodeVim

vscode_002.png

ターミナルVim



VSCode Vim



ターミナルVim



他のエンジニアもVSCodeだし合わせないとなんか気持ち悪い ←今ここ。

そんなVimmerです。

「気持ち悪い」というのも、弊社では「モブプログラミング」を週1で開催しており、環境が異なると僕がドライバーになった際に困るのです。

というわけで、久々にVSCodeを立ち上げてみるも、一部のプラグインが正常に動作しない。

非推奨の「背景表示」プラグインが原因だったり、PHPCSの動作不良で警告が吐かれたり、そもそもめっちゃ動作が重たい。

そんなこんなでアンインストール & インストール・プラグイン導入 までやってみました。

既に同じような記事がいくつも上がってますが、アンインストール時・導入時にハマるポイントなども解説していきます。

*MacBookPro使用してます。


アンインストール

今回はプラグインごと綺麗さっぱり削除したいので、いくつかコマンドを実行します。


## 本体削除
rm -rf /Applications/Visual\ Studio\ Code.app/
## プラグイン削除
rm -rf ~/Library/Application\ Support/Code/
rm -rf ~/.vscode/

僕の場合はプラグインがうまく動作していない様子だったので、プラグインなどのフォルダごと削除しました。


インストール


## Homebrewで導入
brew update
brew cask install visual-studio-code


プラグイン導入

以下、導入したプラグインたちです。

## phpcsについて、php-code-snifferを導入しないとエラーになる

brew install php-code-sniffer


高速化

VSCodeの設定で高速化ができるらしい。

{

"editor.cursorBlinking": "solid",
"editor.fontSize":9,
"editor.highlightActiveIndentGuide": true,
"editor.wordWrap": "on",
"editor.minimap.enabled": false,
"editor.renderIndentGuides": false,
"files.trimTrailingWhitespace": true,
"files.watcherExclude": {
"**/画像/**": true,
"**/.git/objects/**": true,
"**/.git/subtree-cache/**": true,
"**/node_modules/*/**": true
},
"breadcrumbs.enabled": true,
"terminal.integrated.fontSize": 9,
"emmet.includeLanguages": {
"twig": "html",
"vue-html": "html"
},
"workbench.useExperimentalGridLayout": true,
"workbench.colorTheme": "Monokai Pro (Filter Machine)",
"workbench.iconTheme": "Monokai Pro (Filter Machine) Icons",
"fabric.runtime": {
"ports": {
"orderer": 17050,
"peerRequest": 17051,
"peerChaincode": 17052,
"peerEventHub": 17053,
"certificateAuthority": 17054,
"couchDB": 17055,
"logs": 17056
},
"developmentMode": false
},
"window.zoomLevel": 2,
"powermode.enabled": true,
"powermode.presets": "exploding-rift"
}

上記設定の中で、file.watcherExcludeという項目があります。

これは「監視から除外するファイル」を列挙でき、これにより読み込み時に余計なリソースを喰わなくなります。

画像ファイルが監視対象となるのかは定かではないですが、設定するのはタダなのでやっておきました。

"files.watcherExclude": {

"**/画像/**": true,
"**/.git/objects/**": true,
"**/.git/subtree-cache/**": true,
"**/node_modules/*/**": true
},

その他の設定は良しなに変更してください。


感想

ショートカットや設定によってさらに使いやすくなるので、やはりVSCodeは素晴らしいですね。

ターミナルのVimは確かに軽量で多機能ではあるのですが、機能拡張やカスタマイズにかかる時間を考えるとVScodeにVimを導入して周りと開発環境を合わせた方が良いなと感じました。


おまけ

コマンドパレットを開き、「zen」と入力すると「zen modeへの切り替え」という項目が表示される。

僕も上司から聞いて初めて知ったのですが、UIなどを非表示にしてコーデディングに集中できるようにするためのモードだとか。

「zen(禅) mode」ぜひ利用してみてください。(僕は10分触って満足したのでそれ以降利用してない)