DEV Community

Bring Your Vim/Tmux Navigation Reflexes to VS Code

AJ Kerrigan on December 31, 2019

Introduction One of the first tmux plugins that changed my brain was Chris Toomey's vim-tmux-navigator. Sure it makes things more conven...
Read full post
Collapse
 
bdannowitzhudl profile image
BDannowitzHudl •

I know this post is a bit old, but I put these settings in all my VS Code configurations. One thing that I have an issue with is getting this kind of navigation to work from within .ipynb notebooks.

I've found that this works for left and right navigation:

    {
        "key": "ctrl+h",
        "command": "workbench.action.focusLeftGroup",
        "when": "notebookEditorFocused"
    },
    {
        "key": "ctrl+l",
        "command": "workbench.action.focusRightGroup",
        "when": "notebookEditorFocused"
    }
Enter fullscreen mode Exit fullscreen mode

but there is no such action for focusUpGroup/focusDownGroup, and I can't quite get this work work with navigateUp/navigateDown or panels.

Do you have any immediate insights as to how to accomplish this? Thanks for the great post!

Collapse
 
ajkerrigan profile image
AJ Kerrigan •

I don't use notebooks in VS Code much so I didn't have any immediate insights, but your comment got me curious so I went looking for some :D. And the first place I landed was this open issue which you already commented on!

github.com/microsoft/vscode/issues...

I replied to your comment there, but you can add focusAboveGroup and focusBelowGroup bindings to make the workaround cover all directions:

    {
        "key": "ctrl+k ctrl+h",
        "command": "workbench.action.focusLeftGroup",
        "when": "notebookEditorFocused"
    },
    {
        "key": "ctrl+k ctrl+l",
        "command": "workbench.action.focusRightGroup",
        "when": "notebookEditorFocused"
    },
    {
        "key": "ctrl+k ctrl+j",
        "command": "workbench.action.focusBelowGroup",
        "when": "notebookEditorFocused"
    },
    {
        "key": "ctrl+k ctrl+k",
        "command": "workbench.action.focusAboveGroup",
        "when": "notebookEditorFocused"
    }
Enter fullscreen mode Exit fullscreen mode

(At some point after writing this post, I moved my nav bindings into chords off ctrl+k only because I kept running into edge cases where I wanted ctrl+k available.)

Collapse
 
jdsutherland profile image
Jeff Sutherland • • Edited

As someone who isn't fully immersed in modern javascript development but is a content user of vim/tmux (including vim-tmux-navigator), I can't imagine there being such a difference as to be worth giving up vim for. I suspect it has something to do with shortcomings with vim language server integration. Is it more than that? What's the motivation for moving to VS Code?

Collapse
 
ajkerrigan profile image
AJ Kerrigan •

Hey Jeff, I wouldn't try to convince someone to give up vim for VS Code. I still happily use both myself, I just prefer VS Code more often these days and brought some vim muscle memory along for the ride.

Some of the work I prefer to handle in VS Code (testing and debugging for example) are just personal preference, and someone with a good set of vim skills/plugins/configuration would have no reason to switch. Other bits of functionality (like having side-by-side Markdown previews or Jupyter notebooks in the same editor as your regular code) work more nicely in a graphical environment... but not everybody wants or needs that.

I guess this is a bad sales job - I'd say keep using vim :).

Collapse
 
jdsutherland profile image
Jeff Sutherland •

Thanks for the reply AJ.

I'd heard a few people I trust mention either switching or a desire to so it seems like there must be something to this but I haven't probed deeper. I listened to a podcast interview where Chris Toomey himself said as much to my surprise. I've heard that some of the front end tooling is better and IIRC Chris mentioned the language server completion stuff. I just haven't seen what the difference is in practice. If I get more into modern front end development, I'll look further.

Anyways, cheers.

Collapse
 
lxmrc profile image
Alex •

Hi AJ, thanks for writing this. I'm looking at switching from vim/tmux to VS Code too. If you could show me how to bind leader + | and leader + - to create vertical and horizontal splits that would be awesome.

Collapse
 
ajkerrigan profile image
AJ Kerrigan • • Edited

Hi Alex, that seems like a handy binding :). At first I thought the easiest way to handle that would be inside ~/.vimrc, coupled with the "Use key mappings from .vimrc" setting. That worked for split but not vsplit in my setup. That could be an issue just on my end, I've messed with my settings a bunch since this post!

That said, handling it from the VS Code side worked fine for me. The VSCodeVim extension lets you define mode-level overrides, so a block like this in your settings.json should do the trick:

"vim.normalModeKeyBindings": [
    {
        "before": ["<leader>", "|"],
        "commands": [
            "workbench.action.splitEditorRight"
        ]
    },
    {
        "before": ["<leader>", "-"],
        "commands": [
            "workbench.action.splitEditorDown"
        ]
    }
]
Enter fullscreen mode Exit fullscreen mode