If you are one of those people who like Vim, but at the same time I really like VSCode, then this article is for you!
VSCodeVim is an extension for VSCode that makes it possible for you to use Vim shortcuts and commands inside VSCode!
To install this extension click on the extensions tab and write in the search bar: VSCodeVim
, select it and click on Install
Once installed, the extension will already be automatically enabled, that is, when creating a new file you should and will be able to use the modes: Insert, Normal and Visual as it is in Vim.
Remembering that VSCode shortcuts will work simultaneously, for example:
Ctrl + S
to save.
Vim commands will also be available, examples:
:e ~/main.cpp
:vsplit file.md
:w
:!g++ ~/main.cpp
:q
and among others!To create your mappings:
Ctrl + Shift + p
or if you are on macOS, type CMD + Shift + p
preferences
Open User Settings
type: Vim
Vim
and scroll down and click on the option: Edit in settings.json
(Vim: Command Line Mode Key Bindings)Erase the content and start from scratch, eg create a mapping to open the search command, but using the key combination: Ctrl + f
:
{
"vim.normalModeKeyBindings": [
{
"before": ["<C-f>"],
"after": ["/"]
}
]
}
Then test to see that it will be working!
Some shortcuts you create may conflict with VSCode shortcuts, but you can work around it by creating a <Leader>
key, usually using the SPACE
key or separating each character, for example, let’s create one more shortcut to select everything with: Ctrl + a
which in Vim would be the command: ggVG
:
{
"vim.normalModeKeyBindings": [
{
"before": ["<C-f>"],
"after": ["/"]
},
{
"before": ["<C-a>"],
"after": ["g", "g", "V", "G"]
}
]
}
You can also customize the status bar colors, for example in the VSCodeVim repository there is the link vim-airline
(https://github.com/VSCodeVim/Vim#vim-airline), copy the code and paste inside settings.json
and change the colors as you wish!
#554477, #FFFFFF and #028800 for green!
{
"vim.normalModeKeyBindings": [
{
"before": ["<C-f>"],
"after": ["/"]
},
{
"before": ["<C-a>"],
"after": ["g", "g", "V", "G"]
}
],
"vim.statusBarColorControl": true,
"vim.statusBarColors.normal": ["#554477", "#ffffff"],
"vim.statusBarColors.insert": "#028800",
"vim.statusBarColors.visual": "#B48EAD",
"vim.statusBarColors.visualline": "#B48EAD",
"vim.statusBarColors.visualblock": "#A3BE8C",
"vim.statusBarColors.replace": "#D08770",
"vim.statusBarColors.commandlineinprogress": "#007ACC",
"vim.statusBarColors.searchinprogressmode": "#007ACC",
"vim.statusBarColors.easymotionmode": "#007ACC",
"vim.statusBarColors.easymotioninputmode": "#007ACC",
"vim.statusBarColors.surroundinputmode": "#007ACC",
"workbench.colorCustomizations": {
"statusBar.background": "#028800",
"statusBar.noFolderBackground": "#028800",
"statusBar.debuggingBackground": "#028800",
"statusBar.foreground": "#ffffff",
"statusBar.debuggingForeground": "#ffffff"
},
}
iabbr
You can also create abbreviations, for example create a code
for MarkDown
{
"vim.normalModeKeyBindings": [
{
"before": ["<C-f>"],
"after": ["/"]
},
{
"before": ["<C-a>"],
"after": ["g", "g", "V", "G"]
}
],
"vim.insertModeKeyBindings": [
{
"before": ["c", "o", "d", "e"],
"after": ["`", "`", "`", "\n", "`", "`", "`"]
}
],
"vim.statusBarColorControl": true,
"vim.statusBarColors.normal": ["#554477", "#ffffff"],
"vim.statusBarColors.insert": "#028800",
"vim.statusBarColors.visual": "#B48EAD",
"vim.statusBarColors.visualline": "#B48EAD",
"vim.statusBarColors.visualblock": "#A3BE8C",
"vim.statusBarColors.replace": "#D08770",
"vim.statusBarColors.commandlineinprogress": "#007ACC",
"vim.statusBarColors.searchinprogressmode": "#007ACC",
"vim.statusBarColors.easymotionmode": "#007ACC",
"vim.statusBarColors.easymotioninputmode": "#007ACC",
"vim.statusBarColors.surroundinputmode": "#007ACC",
"workbench.colorCustomizations": {
"statusBar.background": "#554477",
"statusBar.noFolderBackground": "#554477",
"statusBar.debuggingBackground": "#554477",
"statusBar.foreground": "#ffffff",
"statusBar.debuggingForeground": "#ffffff"
},
}
Then test create a MarkDown file, example: :e ~/file.md
and type code
and press space.
And among many other things, for more information access the repository and the address through the links:
The video is in Portuguese, but everything discussed here is in the video.