はじめに
NERDTreeはディレクトリツリーを表示してファイル操作を行うVimのプラグインです。
VSCodeは統合開発環境のためエクスプローラー機能が存在します。そのため，キーバインディングを変更することによって，NERDTreeをVSCodeで再現します。
再現と言っても，完全には再現できないため，以下の機能のみです。
- ファイル選択，フォルダの展開
- エディタとエクスプローラー間のフォーカス移動
- エクスプローラーの表示・非表示トグル
- mキーとの組み合わせによるファイルシステム操作
手順
Code > 基本設定 > キーボードショートカットを選択しキーボードショートカットの設定画面が出たら，右上の![スクリーンショット 2019-11-11 19.28.00.png]()
からJSON表示に切り替える。以下のコードを貼り付ける．
keybindings.json
[//--------------------------------------------------//NERDTree風//--------------------------------------------------//サイドバーの表示トグル(サイドバーの表示・非表示){"key":"ctrl+n","command":"workbench.view.explorer","when":"!explorerViewletVisible && vim.mode != 'SearchInProgressMode' && vim.mode != 'Insert'"},{"key":"ctrl+n","command":"workbench.action.toggleSidebarVisibility","when":"explorerViewletVisible && !searchViewletVisible && !inDebugMode && vim.mode != 'SearchInProgressMode' && vim.mode != 'Insert'"},//サイドバーフォーカストグル(サイドバーは表示したまま，フォーカスを切り替え){"key":"ctrl+h","command":"workbench.action.focusSideBar","when":"editorFocus"},{"key":"ctrl+h","command":"workbench.action.focusFirstEditorGroup","when":"!editorFocus"},//ファイルの時は"Enter"or"o"で同一タブで表示{"key":"Enter","command":"list.select","when":"explorerViewletFocus && explorerViewletVisible && !explorerResourceIsFolder && !inputFocus"},{"key":"o","command":"list.select","when":"explorerViewletFocus && explorerViewletVisible && !explorerResourceIsFolder && !inputFocus"},////フォルダのときは"Enter"or"o"で展開{"key":"Enter","command":"list.toggleExpand","when":"explorerViewletFocus && explorerViewletVisible && explorerResourceIsFolder && !inputFocus"},//"s"で別ウィンドウで開く{"key":"s","command":"explorer.openToSide","when":"explorerViewletFocus && explorerViewletVisible && !explorerResourceIsFolder && !inputFocus"},//---ファイルシステム系---//"m + r"でリネーム{"key":"m r","command":"renameFile","when":"explorerViewletVisible && filesExplorerFocus && !inputFocus"},//"m + c"でコピー{"key":"m c","command":"filesExplorer.copy","when":"explorerViewletVisible && filesExplorerFocus && !inputFocus"},//"m + p"でペースト{"key":"m p","command":"filesExplorer.paste","when":"explorerViewletVisible && filesExplorerFocus && !inputFocus"},//"m + a"でファイル追加{"key":"m a","command":"explorer.newFile","when":"explorerViewletVisible && filesExplorerFocus && !inputFocus"},//"m + d"で削除{"key":"m d","command":"deleteFile","when":"explorerViewletVisible && filesExplorerFocus && !inputFocus"},//"m + f"でフォルダ追加{"key":"m f","command":"explorer.newFolder","when":"explorerViewletVisible && filesExplorerFocus && !inputFocus"},]操作方法
| コマンド | 説明 |
|---|---|
| Ctrl+n | エクスプローラーの表示・非表示 |
| Ctrl+h | エクスプローラーとエディタ間のフォーカス移動 |
| Enter, o | 同じウィンドウでファイルを開く(フォルダのときは展開) |
| s | 別ウィンドウでファイルを開く(垂直方向) |
| m+r | ファイル・フォルダリネーム |
| m+c | ファイル・フォルダコピー |
| m+p | ファイル・フォルダペースト |
| m+a | ファイル追加 |
| m+f | フォルダ追加 |
| m+d | ファイル・フォルダ削除 |
補足
条件として!inputFocusをつけているのは，ファイル追加などエクスプローラー上でテキスト編集を行う際に，コマンドとして使用しているキーを入力できるようにするため。