DEV Community

Public Salad
Public Salad

Posted on

4 1

My favorite Vim Settings in Vscode so far!

Sublime Text 3 Days...

At my first job I was a Sublime text 3 enjoyer with the "Six" plugin extension to use vim keybindings, I thought Sublime Text 3 is more superior with Visual studio code because of its performance and at the time I don't like using Chromium based applications because chrome already eats up all of my ram.

After a while I started to learn ReactJS development with ST3 but could not find a good article/tutorial on how to setup ST3 for ReactJS Development. I saw my coworkers using Visual studio code with their fancy Intellisense & Formatting of code on save. So i thought, you only live once so why not try it.

I tried it, And I can say I am now a Visual Studio Code With VscodeVim enjoyer. I'll show you my favorite Visual Studio Code & Vim Settings to boost productivity!(Hopefully)

On to the Settings...

"Space" as my leader key

{
    "vim.leader": "<space>",
}
Enter fullscreen mode Exit fullscreen mode

Save, Close current file, Search, Remove Searched Highlights(nohl)

{
"vim.normalModeKeyBindingsNonRecursive": [
        {
            "before": [
                "leader",
                "w"
            ],
            "commands": [
                "workbench.action.files.save"
            ]
        },
        {
            "before": [
                "leader",
                "q"
            ],
            "commands": [
                ":q"
            ]
        },
        {
            "before": [
                "<leader>",
                "f"
            ],
            "after": [
                "/"
            ]
        },
        {
            "before": [
                "<leader>",
                "n"
            ],
            "commands": [
                ":nohl"
            ]
        },
]
}
Enter fullscreen mode Exit fullscreen mode

Enable Default Ctrl keys

{
    "vim.handleKeys": {
        "<C-v>": false,
        "<C-s>": false,
        "<C-y>": false,
        "<C-z>": false,
        "<C-p>": false,
        "<C-q>": false,
        "<C-n>": false,
        "<C-x>": false,
        "<C-b>": false,
        "<C-a>": false,
        "<C-f>": false,
    },
}
Enter fullscreen mode Exit fullscreen mode

Quickly go to Top/Bottom

{
"vim.normalModeKeyBindingsNonRecursive": [
        {
            "before": [
                "<leader>",
                "j"
            ],
            "after": [
                "G"
            ]
        },
        {
            "before": [
                "<leader>",
                "k"
            ],
            "after": [
                "g",
                "g"
            ]
        }
    ],
}
Enter fullscreen mode Exit fullscreen mode

Extras (I rarely use this because muscle memory of default vim combos)

{
    "vim.normalModeKeyBindings": [
        { // quick deletes a highlighted block
            "before": [
                "<leader>",
                "d"
            ],
            "after": [
                "d",
                "d"
            ]
        },
        { // Go to next file tab
            "before": [
                "<tab>"
            ],
            "commands": [
                "workbench.action.nextEditor"
            ]
        },
        { // Go to previous file tab
            "before": [
                "<S-tab>"
            ],
            "commands": [
                "workbench.action.previousEditor"
            ]
        }
    ],
    "vim.normalModeKeyBindingsNonRecursive": [
        {
            "before": [
                "<leader>",
                "j"
            ],
            "after": [
                "G"
            ]
        },
        {
            "before": [
                "<leader>",
                "k"
            ],
            "after": [
                "g",
                "g"
            ]
        }
    ]
}
Enter fullscreen mode Exit fullscreen mode

That's all the shortcuts i usually use when I'm coding, Of course a couple of this shortcuts I discovered @ stackoverflow & reddit.

I also made a video showing more shortcuts & vscode settings that you can watch Here, if you prefer watching a youtube video!

That's about it. Hope you enjoyed the quick read!

Image description

Image of Datadog

Master Mobile Monitoring for iOS Apps

Monitor your app’s health with real-time insights into crash-free rates, start times, and more. Optimize performance and prevent user churn by addressing critical issues like app hangs, and ANRs. Learn how to keep your iOS app running smoothly across all devices by downloading this eBook.

Get The eBook

Top comments (1)

Collapse
 
jessesousa profile image
Jesse Sousa

This helped me a lot. Thank you!

Eliminate Context Switching and Maximize Productivity

Pieces.app

Pieces Copilot is your personalized workflow assistant, working alongside your favorite apps. Ask questions about entire repositories, generate contextualized code, save and reuse useful snippets, and streamline your development process.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay