Mastering VIM Motions in VSCode (Mouseless development)

Подписаться 33 тыс.

Просмотров 107 тыс.

50% 1

I love VIM. Using VIM is absolutely critical to my performance. I recently made a video where I am LEAVING NEOVIM to go to VSCode and I had to share my set up. I'm sorry ‪@ThePrimeagen‬ ‪@teej_dv‬
Whether you're a VIM enthusiast or new to this text editor, this step-by-step guide will take you from the basics to advanced techniques, helping you become a VIM motion pro in no time. With the VIM extension for VSCode, you can harness the full potential of VIM's motion commands without leaving your favorite IDE.
THE CONFIG FILES:
github.com/Melkeydev/vscode_b...
Leaving NEOVIM for VSCode Video Link:
• Why I am LEAVING Neovi...
Twitch
I stream live on Twitch every weekend
Twitch : / melkey
Join the amazing community on Discord
Discord: / discord
I post memes and host Twitter Tech Spaces
Twitter: / melkeydev
SUBSCRIBE OR GET LAID OFF
╔═╦╗╔╦╗╔═╦═╦╦╦╦╗╔═╗
║╚╣║║║╚╣╚╣╔╣╔╣║╚╣═╣
╠╗║╚╝║║╠╗║╚╣║║║║║═╣
╚═╩══╩═╩═╩═╩╝╚╩═╩═╝
#coding #neovim #typescript #programming #vim #softwareengineering #codinglife #webdesign #webdevelopment #webdev #javascript #rustlang #rust #twitch #twitchstreamer #programmerhumor #codinghumor #software #softwareengineer #softwaredeveloper #softwaredevelopment #gymbro #gym #programmerhumor #programming #coding

Наука

Опубликовано:

12 июл 2023

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 227

@MelkeyDev 11 месяцев назад

I hope you all enjoy this video! Let me know what you all think and what video you want to see next. BTW THANK YOU FOR 3,000 SUBSCRIBERS!!!

@conconmc 5 месяцев назад

Thanks for the video my dude, just FYI your settings and bindings file on the video don't match what you have on your github link

@kipcrossing 10 месяцев назад

Later this year I need to update my dev setup. I'll be coming back to this video. Thanks!

@LPrulzcrossover 7 месяцев назад

Thank you for the bindings, I'm just learning vim motions and it already feels great. Those terminal toggle keys are great!

@MelkeyDev 7 месяцев назад

:) Youre very welcome

@sayo9394 8 месяцев назад

really enjoyed this video! the new keybindings made it possible to finally adopt vim motions in vscode!

@bppdc 11 месяцев назад

I have almost the same setup in VSCode with keybindings and settings, works great. Thanks for sharing.

@bfkgod 11 месяцев назад

Hell yeah. I recently switched as well from NeoVim to VSCode and have been stuck using the bare defaults. This is exactly what I needed. Thanks.

@MelkeyDev 11 месяцев назад

Hell yeah

@tobiadeniji6630 3 месяца назад

Just curious, what made you switch from neovim to VSCode ?

@health_doc 2 дня назад

Ctrl-t @@tobiadeniji6630

@jansustar4565 10 месяцев назад

To get even better visuals, you can set the toolbar to toggle with alt (which is a bit buggy but works well enough) and install a material theme and run everything fullscreen.

@MelkeyDev 10 месяцев назад

That is pretty nice

@luisloyola3591 4 месяца назад

thanks for the keybinding, now I can get more out of vim without having headaches with settings. Tremendous work, it's simple and conquer, straight to the point to be productive.

@MelkeyDev 4 месяца назад

I am actually going to re-make this video with some updates

@Shohan11d 3 месяца назад

@@MelkeyDev This is amazing. Waiting eagerly for the updated video :)

@Lucha-dorito 2 месяца назад

@@MelkeyDev Is this video still coming?

@caasidev6812 11 месяцев назад

Thanks @Melkey. I jumped back to VSCode couple of weeks before you did, and this is exactly what I was looking for!! Thanks a lot man!

@MelkeyDev 11 месяцев назад

You're welcome!

@thecarpenter_son 11 месяцев назад

Hey melkey the thumbnail is really good well done :)

@MelkeyDev 11 месяцев назад

Hell yeah thumbnail gang

@zacharymilo 6 месяцев назад

Exaclty what i was looking for 😎 subscribed for sure 💪

@MelkeyDev 6 месяцев назад

Awesome, thank you!

@AliFahim92 11 месяцев назад

This was awesome. I tried neovim but it was not for me yet at least. I wanted to make vs code more like vim but I got a bit overwhelmed. thanks for this banger video

@MelkeyDev 11 месяцев назад

Hell yeah

@vanhoheneim 13 дней назад

Thanks man your video got me into VIM for VScode !

@ThomLamb416 4 месяца назад

Love this video. Thanks man!

@VIYH-mt5dz 13 дней назад

the nerdTREE extension makes file navigation and creation super easy, ctrl + n to open the file explorer, vim bindings to navigate and m + a to make a file, m + f to make a directory

@MelkeyDev 11 дней назад

Maybe I just check it out

@igrb 5 месяцев назад

what a banger melk cant believe I didn't watch this ealier

@tyfischer4739 11 месяцев назад

Overall pretty good! If you aren’t already you can configure your file explorer to use j and k to move up and down as well as / to search a file.

@MelkeyDev 11 месяцев назад

Thank you! I appreciate it

@Joeysz 6 месяцев назад

How would you set this up?

@paperwave442 9 месяцев назад

Thanks a lot, this is a I've been searching for something like this

@MelkeyDev 9 месяцев назад

Glad I could help

@tenthlegionstudios1343 11 месяцев назад

I still use VSCode at work - but use nvim in all my personal projects. Will definately be using a lot of these tricks on my vanilla vscode extension. Much Appreciated!

@namanvyas3058 11 месяцев назад

"vim.useSystemClipboard": true, This uses system clipboard so when you yank something from web a simple p works instead if Ctrl+shift+p

@MelkeyDev 11 месяцев назад

GAS tip thank you

@oskarkarlsson8905 6 месяцев назад

Is there anyway to get a better statusbar inside of vsc for the vim plugin? Id like just a nice way of knowing what mode im in x]

@wojciechbojewski9442 11 месяцев назад

This is what I need it. Thank you!

@MelkeyDev 11 месяцев назад

Hell yeah!!

@lavosier2 Месяц назад

thanks for your video. hugs from Brazil

@lipepaniguel 7 месяцев назад

this is exactly what I needed. thank you sir

@MelkeyDev 6 месяцев назад

Glad I could help

@ShiVam-fq3xu 10 месяцев назад

i am having a trouble with a key i am using vscodium while when i accidently press shift+j instead of ctrl+shift+j to toggle terminal what happens is it shifts the below next line to the same line of the cursor in normal mode how can i disable that? i could'nt find that keybind in keyboard shortcuts! And Thanks for this amazing video!

@overrevvv 9 месяцев назад

Thank you so much for this video.

@MelkeyDev 9 месяцев назад

You are so welcome!

@lmnts556 11 месяцев назад

For people who have the time, use both and mess around with them both. In general I use a lot of vscode but if I have to do a lot of terminal/remote work I absolutely love to use nvim.

@vaibhav5783 11 месяцев назад

I am learning full stack. Whenever I do front end I use VS code. for backend I use vim.

@austinhutchen 4 месяца назад

@@vaibhav5783vim is good for frontend too my friend

@hlibtumakov4367 8 месяцев назад

I'm a backend engineer and I've been using neovim for the last 2 years on a daily basis, and it worked like a charm! Considering that I have my workflow built with tmux sessions/windows it was really convenient and definitely more than enough. But as soon as I started playing with some modern JS frontend technologies I had to make this decision as well... If you want to write client-side (not vanilla) JS you can not avoid using VSCode. Thanks for this guide! It helped me a lot with my vim-like VScode config :)

@MelkeyDev 8 месяцев назад

yes sir!

@darianmorat 7 месяцев назад

WSL2 + VIM + VSCODE

@carlwilde635 6 месяцев назад

We are wetting ourselves laughing watching your video with the volume off, and playing Freddy Mercury and Queen through the boombox (It's a Kinda Magic - Live 7/11/86). Because of your animated style, expressions, gesticulations, the mo, studio headphones, and mic it is beyond funny. Considering you didn't rehearse, how did you completely nail some of the LipSynch. Sooooo funny. Please get a co-host so we can do "Under Pressure" next.

@danielvega646 8 месяцев назад

It would be great to also implement the built-in vs code ctrl + p ctrl + t commands to rapidly explore through files or other vscode settings.

@MelkeyDev 8 месяцев назад

I might need to do another video then

@thiagopuntar 5 месяцев назад

One thing that I didn't find yet is to use vim motions on vscode search and replace tab. But with you keybindings.json overrides, this is giving me some ideas.

@SyntaxLexx 11 месяцев назад

Nice! Coming from Webstorm, I can confidently say it's actually impossible avoiding touching the mouse regularly when it comes to VsCode. Nevertheless, there's some notable keybindings you can add to speed up productivity: 1. Adding 'shift shift' to quickly do what 'ctrl+P' does (view recently opened files - just like IntelliJ) 2. Adding 'alt alt' to quickly launch the command palette (ctrl+P then '>') 3. Adding 'ctrl ctrl' to toggle the 'sidebar'

@lolapplesauce 11 месяцев назад

When do you find you have to use the mouse in vs code? I think for me it's just one thing and that's switching between split integrated terminals to another. And I probably just don't know it off the top of my head

@Noam-Bahar 11 месяцев назад

Ctrl shift P also opens the command palette

@dmytrk 11 месяцев назад

Yes, also Vim plugins interfere with existing shortcuts and that's what makes open some NeoVim or use Win-Vind for Vim motions in Windows

@SyntaxLexx 11 месяцев назад

@@Noam-Bahar It's literally indicated on point 1!

@chaitanyashahare2734 10 месяцев назад

really well layed out video

@MelkeyDev 10 месяцев назад

Thank you :)

@Winsen737 10 месяцев назад

Question : say you have file explorer, terminal and a bunch of files open how do you navigate between all of them ?

@josephstark4259 4 месяца назад

Yes I see how you open them, but how do you get your cursor in and out of terminal?

@TragicGFuel 2 месяца назад

@@josephstark4259 ctrl + ~

@user-mm2kh2rk2i 11 месяцев назад

hey @MelkeyDev how did you add your name 'MelkeyDev' in vscode terminal? that's look cool! I also want to add my name in vs code terminal.

@nexxel 11 месяцев назад

learnt a lot thanks melks

@MelkeyDev 11 месяцев назад

If you find some stuff please let me know

@NoctuaDeveloppement 8 месяцев назад

Amazing mate ! Love your content ! In fact I begin to learn Go 😅 I assume you know it but when you're in the file tree, and you press n to add a file, if you end your word by a / it create a folder. So this : "test/" would create a "test" folder. "test/test.go" create "test.go" inside a test folder (create it if it does not exist). Pretty neat when you begin to create a file but it would be better in a folder 😅 And just a quick question, what's your keyboard layout ? Did you follow Prime with the Dvorak ?

@MelkeyDev 8 месяцев назад

Ah welcome! And no - I use a Moonlander regular qwerty layout

@mrrapoclapo 11 месяцев назад

Thank you Melkey!

@MelkeyDev 11 месяцев назад

my pleasure mr rapo

@Shohan11d 3 месяца назад

Thank you for sharing your configuration.

@Omprakash-fd2pc 3 месяца назад

it's not working the right way in my system .. idk why

@Shohan11d 3 месяца назад

@@Omprakash-fd2pc What is the problem that you are facing?

@kustin4208 9 месяцев назад

What theme are you using?

@undefined_null 11 месяцев назад

Got a lot of useful keymaps for vim inside vs-code from this video🤝. Just one thing, I would not use "shift" as a prefix for keymaps inside the terminal because how would you type capital letters?🙂 I instead use ctrl + h, j, k, l to move between panes inside the terminal. Maybe there is a better way idk I'm too lazy.

@MelkeyDev 11 месяцев назад

good call!

@user-mj1vr6ye4x 8 месяцев назад

thank you for this amazing explanations. But i have one problem. If i open an empty project and type cntl + e i cant do anything in file tree (create file/folder). Also i find it impossible to switch between file tree and actual file. It works only if i close my file tree with cntl + e.

@camilotello3296 3 месяца назад

Heyyy I really needed this. Now I'll take way less time for coding :)

@_Maruf 4 месяца назад

great. I have a question. please answer, how can I disable mouse in insert mode ?? set mouse=n, it does not work in vscode, is there any equivalent command ??????

@danel44 3 месяца назад

where do i find the keybindings.json and settings.json ? i used vscode foar bit but don't know where to find them, btw using linux, so anyone that knows and want's to help me, please.

@peterkyle_0125 6 месяцев назад

Thanks so much Melkey , I now feel like a real developer 🤯

@hguarneri 2 месяца назад

How is the debugging experience with relative line numbers?

@namanvyas3058 11 месяцев назад

The best thing about vim is I learn new this everyday and its always some magic. I learned about macros last week.

@MelkeyDev 11 месяцев назад

ya - absolutely. Thank you for sharing!

@aleclowry7654 9 месяцев назад

Why vim plug-in and not the embedded neovim Extension

@user-xs5rd7en5e 5 месяцев назад

why the cursor longpress(j and k ) is not working? in neovim I can longpress j and k to go down and up

@prabinlamsal74 9 месяцев назад

Now when I type shift + n for doing the capital N , a new window opens . How are you guys using these keybindings????

@prabinlamsal74 5 месяцев назад

You need to not be in the insert mode basically. lol.

@avner1999 Месяц назад

Got a question, and sorry if it is a dumb question, i'm super new to vim. How can I close a tab in vs code using vim?

@MelkeyDev Месяц назад

You can use certain plugins, but with my config its q

@TheAkayuki 11 месяцев назад

What do you think of the neovim extention for vscode, I find its more faster for vscode?

@MelkeyDev 11 месяцев назад

i havent used it yet

@The-Bloke 5 месяцев назад

Anyone got thoughts on the NeoVim extension for VSCode instead of the Vim extension? I've been using that instead of the Vim extension because I use neovim whenever I'm not in VSCode - not that there's any direct connection, as my init.lua for neovim is fully disabled in vscode. Maybe I should switch to the base Vim extension instead if it works more easily with these pre-made configs

@tihon4979 Месяц назад

Awesome! Best workflow! Like!

@MelkeyDev Месяц назад

Thank you so much

@andisheabbasian5185 4 месяца назад

so helpfull thanks

@harshavardan9054 11 месяцев назад

Hey i have a question man my code editors like vsc codeblocks and cion take nearly 30 seconds to output any suggestions on how to reduce the time

@EbonySeraphim 4 месяца назад

The fact that the answer to this question remains unanswered among VsCode fans is hilarious. Ask the same question among a Neo/vim community and you’ll have answers about how to get the answer.

@harshavardan9054 4 месяца назад

@@EbonySeraphim i think it was due to my ram being less so I have to upgrade it to a 8gb ram

@NESRockman1987 6 дней назад

Is this even faster than VS code schort cuts? I did not feel any different if you know well the the vs code short cuts.

@MelkeyDev 6 дней назад

Its just the preference

@MadisonKanna 7 месяцев назад

helpful vid for us vim newbies

@MelkeyDev 7 месяцев назад

We are always vim newbies - forever

@MO-fg2cm 7 месяцев назад

@@MelkeyDevdoes that apply to primeagen?

@salaheddineelfarissi101 4 месяца назад

Thank you.

@leviwilkerson3964 7 месяцев назад

With your current keybinds, how are you meant to type capital J? From my testing I'm not able to type due to the terminal toggle

@MelkeyDev 7 месяцев назад

I actually have it updated - if you check out the repo on github

@leviwilkerson3964 7 месяцев назад

I did, tailored it to me. Works great :) Good work @@MelkeyDev

@tuvantran660 14 дней назад

I really want to use Vim motion in vscode. However, it is really buggy, and lag between each motion action like switch buffer and split pane. Is there any solution to fix this ?

@johannes6009 8 месяцев назад

Followed your vscode-vim config setup. 1 Question for a command/keybinding that is missing (so I never need to touch the mouse): When opening a new project in vscode from the terminal that hasn’t been opened before it defaults to the welcome page with the explorer panel open. When changing to the panel on this welcome page it has a general selection across the entire panel so doesn’t allow me to navigate over the files, to open the first file to be viewed in the editor until I select somewhere once with the mouse. Not sure if this is clear or understandable? Anyway around this?

@thotchocolate9817 3 месяца назад

I love, love, love videos like this because even if I don't really use vscode (java stack here, intellij users rise up), I still like to see what keymappings other people use. This vid inspired me to reevaluate what I'm doing in intellij, and I've cleaned a few things up. Ty kind sir!

@sq-zb2ps 18 дней назад

What does leader mean in the context of these keybinds

@John-pt8ht 11 месяцев назад

Pow it up brother

@MelkeyDev 11 месяцев назад

You already know it

@pangiolillo 11 месяцев назад

Maybe I looked it over, but how do you close the file explorer after using ne

@pes18fan 11 месяцев назад

Yeah I have the same question

@MelkeyDev 11 месяцев назад

ctrl+b

@MelkeyDev 11 месяцев назад

ctrl+b

@megasuperlexa2 9 месяцев назад

I believe it is changed to ctrl+e for both opening and closing since then (in the git files)

@JeffFasulkey 11 месяцев назад

why not use the vscode neovim extension? It seems to have alot less lag

@MelkeyDev 11 месяцев назад

I havent gone around to try it

@megasuperlexa2 9 месяцев назад

it is somehow much less convenient, maybe because it doesnt support mouse selection at all, while vscodevim does

@jazzyBSD 8 месяцев назад

thank u bro

@MelkeyDev 8 месяцев назад

You're welcome!

@emil_l889 11 месяцев назад

This shit slaps, senior creator fr!

@MelkeyDev 11 месяцев назад

slaps harder than my fathers belt

@zeeeeeman 6 месяцев назад

You've updated these in git, so they keys have slightly changed in the video- they need control prefix. I can't get new terminal tab working 🤷

@tzuilee588 6 месяцев назад

Finally going back to vscode with vim motions after half a year of neovim, no more packersync 😭

@vandorlokronika9581 26 дней назад

Can VS code keybindigs approach vim motions in speed? For me it is questionable, I mean if you constantly use VS code short cuts instead of mouse you can drastically speed up your workflow also. I only use mouse when it is easier or necessary because there are no keybinding for it. For example multi line selecting etc. Modern keybindigs can be very fast if you know how to use them.

@Anteater_Taming_Masterclasses 11 месяцев назад

Cant live without tmux...

@cassiorsfreitas 11 месяцев назад

I’m keep using, but not as an IDE

@AkioJunichiro 3 дня назад

A mate told me to check VIM motion so i'm here : "leader + W : allowed me to save a file that's pretty standard." Ctrl + S ??? Leader + C => ctrl + / In general I don't see were we save time. It's just different shortcuts.

@MelkeyDev 3 дня назад

I mean, its just on how you use them and its something that you can use in your daily coding editor

@dotak9663 3 месяца назад

how to close the tabs

@fabriziomeinero 2 месяца назад

Why didn't you opt for the neovim extension?

@MelkeyDev 2 месяца назад

Hmm, idk, i sort of just found my way around using Vim and the VsCode config *shrug*

@wasistderunterschied3273 2 месяца назад

i hate it - ill learn it just to proove to myself i was right hating it, otherwise ill have a new skill - win, win :D Still have a question: Why are the default keybinds for up, down, left, right "hjkl"? There are arrows on the keyboard - placed intuetively - dont tell me my fingers are not allowed to travel that far. i have to press "esc" to get in [vi]rgin [m]ode.

@yohance6904 Месяц назад

that last part of your comment caught me so off guard lol

@yosansu 7 месяцев назад

any idea how to get live grep? something like telescope?

@MelkeyDev 6 месяцев назад

I think VScode has something there

@sanskarsharma9494 6 месяцев назад

Oo. I’ll take a look 👍🏼

@thats_a_bug 7 месяцев назад

Are you using mint? cause it's seems like it

@MelkeyDev 7 месяцев назад

Nah - this is Ubuntu

@thats_a_bug 7 месяцев назад

@@MelkeyDev though I am using Ubuntu but didn't recognize that in the first place.😅😅

@programacion3694 2 месяца назад

owo

@impossiblekiwi5992 11 месяцев назад

How do you close a pane?

@MelkeyDev 11 месяцев назад

@bobobubs 6 месяцев назад

Hey man thanks for the video. Just a heads up the config files that you linked to in this video ARE NOT the same as what you used in the video. They are pretty minor differences and I was able to figure them out but it would help if you put a disclamer in the Repo's README

@anj000 11 месяцев назад

But there are already shortcuts to do some of this things. Why do I should change it? Normally a CTRL is a "leader" key in Windows. I can not imagine changing it to a space. Sounds like inventing a wheel second time.

@tyfischer4739 11 месяцев назад

Vim bindings are the results of a bunch of nerds arguing on the most optimal layout for text editor productivity.

@tenthlegionstudios1343 11 месяцев назад

ya if you are used to VSCode motions already - no need to switch . But one arguement for using VIM bindings is that vim is usually available on any terminal if you SSH into a server or something like this, or have a tmux connection to a remote server. It is also for people who prefered the vim bindings but are looking to come back to VSCode.

@theangelofspace155 9 месяцев назад

The point is use the global available vim binding, not the only work on vacodey binding.

@eyebol 22 дня назад

how do I find the settings.json file

@MelkeyDev 21 день назад

I gotta update this video but its in my Github

@js-ny2ru 5 месяцев назад

I always had problem with ctrl+c and ctrl+x with vim emulator...

@LPrulzcrossover 7 месяцев назад

Did you take a look at the neovim extension for vs code? It actually connects to a real nvim instance instead of emulating vim. Might be worth a look for you. Or if you already saw it: Why did you chose against it?

@MelkeyDev 7 месяцев назад

Yeah, i saw it, but i havent had a chance to actually use it. IDK - is it worth it?

@LPrulzcrossover 7 месяцев назад

@@MelkeyDev I just started out learning vim (motions) entirely two weeks ago, so I can't say if one is better than the other. But from what I heard, the neovim extension is less buggy than the emulation one. Plus you can actually use your neovim config, albeit not every plugin working correctly (i.e. I had the lazyvim distro installed which did not work with vs code). However using the neovim extension feels great so far, integrating well into vs code. I didn't have to customize things too much. The readme is quiet thorough, too.

@Endurancecoach00 11 месяцев назад

You gotta pow it

@MelkeyDev 11 месяцев назад

its mandatory

@Fitzpa14 9 месяцев назад

What button is “leader”?

@MelkeyDev 9 месяцев назад

space

@robosergTV 2 месяца назад

??? Why do we need the VIM plug-in if we using custom keymapping anyway lol

@bit9524 7 месяцев назад

vim is like a cult

@MelkeyDev 6 месяцев назад

Yeah, it can be for sure

@lmnts556 11 месяцев назад

ctrl + p also opens the file search, ctrl + s also saves a file. No need to rebind those 😂 Plenty of these already have shortcuts, like commenting block is ctrl + ' (depending on keyboard, but by the enter key for me). Ctrl + tab to indent, ctrl + shift + tab to indent back again.

@MelkeyDev 11 месяцев назад

Good tip!

@lmnts556 11 месяцев назад

@@MelkeyDev If you are on windows you can also use AHK to fill in any gaps that can't be filled. I also use it to create macros that I can also use outside of vscode/nvim. if I need to delete a line, or jump to start/end of file, start or end of line, select the entire line, select half the line and so on. Vim motions or vscode macros do not work everywhere but AHK does, making it great.

@davidmmadden 8 месяцев назад

this setup seems to block your ability to type multiple words in modals like the cmd+p or the copilot modal. it registers as you being in visual mod when you're in those modals, so the space acts as a leader even when you want to type a space. doesn't look like there's a real way around this, so back to nvim

@howuseehim 10 месяцев назад

Every twitch dev has a moustache?

@MichaKurzewski 2 месяца назад

not pirate software

@paninger 12 дней назад

😂

@Vikram_Naik 9 месяцев назад

How to undo in vim?

@theangelofspace155 9 месяцев назад

@davidomar742 7 месяцев назад

after losing hours of my life configuring neovim and successfully doing it, I decided it was such a waste of time and went back to vscode lol. vim is cool for basic text editing. but trying to make it into an ide doesnt makes sense for me