vscode + vim 全键盘配置(一)

作为一个 vim 多年用户,前后使用过 vim,neovim,lazyvim,spacevim 等多种编辑器,但是最终还是回归到 vscode。原因嘛,主要是不想折腾了,vim 可以高度自由的定制功能,但是需要花费大量的时间,也有较高的学习成本,而且一旦插件经常会有一些兼容性的问题,所以过一段时间可能就需要更新一次配置。

另外,新公司给配了 macbook m2 款,vscode 的性能也就不再是问题了,所以我现在 coding 是以 vscode 为主,neovim 为辅。

这篇文章大概介绍一下我的一些常用的 vscode vim 配置及快捷键,如果对这方面的内容感兴趣的话,可以在评论区回复 1,我会考虑出一个专栏来写继续更新更详细的配置及操作

前置插件

  1. vim
  2. codeium
  3. github theme(非必需)

vim 入门教程

安装好 vim 后,在终端输入如下指令,进入官方教程,跟着步骤学完后,会让你对 vim 有一个基本的认识并且知道一些简单的移动、修改操作

vimtutor

vimrc 配置

在根目录下新建 .vscodevimrc 文件,

touch ~/.vscodevimrc

加入如下内容

" 相对行号
set rnu
" 跳转到行的开头
nnoremap H ^
" 跳转到行的结尾
nnoremap L $
" 跳转到匹配括号
nnoremap M %
" 窗口移动
map <C-j> <C-W>j
map <C-k> <C-W>k
map <C-h> <C-W>h
map <C-l> <C-W>l
" 编辑器内 Tab 切换
noremap <leader>1 1gt
noremap <leader>2 2gt
noremap <leader>3 3gt

光标移动

1. 行内移动

h 向左移动一个字符
l 向右移动一个字符
H 移动到行开头(依赖 vimrc 配置)
L 移动到行结尾(依赖 vimrc 配置)
% 跳转到匹配符号(依赖 vimrc 配置),如光标在{,按下后可以跳转到对应的}
w 移动到下个单词的开头
W 移动到下个单词的开头,忽略中间标点
b 移动到上个单词的开头
B 移动到上个单词的开头,忽略中间标点
e 移动到下个单词的末尾,如果当前光标在单词上,则移动到该单词的结尾
E 移动到下个单词的末尾,如果当前光标在单词上,则移动到该单词的结尾,忽略中间标点

Tips: w、b、e 操作前都可以加上 n,比如:3w,表示同时按下 3 次 w

2. 行内移动到指定字符

  1. f 字符表示移动到行内当前光标后面的第一个字符,F 字符则为反向;
  2. t 字符表示移动到行内当前光标后面的第一个字符的前一个位置,T 字符则为反向;

示例,如以下代码光标在行头,我想快速跳转到字符 1 的位置,则按下 f1 即可

setCount(count   1);

3. 以行为单位移动

k 移动到上一行
j 移动到下一行

4. 以屏幕为单位移动

zt 光标所在字符不动,将当前行移动到屏幕顶部
zz 光标所在字符不动,将当前行移到屏幕中间
zb 光标所在字符不动,将当前行移到屏幕底部
ctrl f 向下翻页,移动一整个屏幕
ctrl b 向上翻页,移动一整个屏幕

5. 使用 easymotion 插件跳转到任意位置

在 settings.json 中增加如下配置:

"vim.leader": " ",
"vim.vimrc.enable": true,
"vim.easymotion": true,
"vim.normalModeKeyBindings": [
	{
		"before": ["leader", "j"],
		"after": ["leader", "leader", "w"]
	},
	{
		"before": ["leader", "k"],
		"after": ["leader", "leader", "b"]
	},    
]

如下操作

vscode + vim 全键盘配置(一)

窗口操作

ctrl l 移动到右侧的窗口
ctrl h 移动到左侧的窗口
ctrl 1 移动到当前编辑器组的第一个 tab
ctrl 2 移动到当前编辑器组的第二个 tab
ctrl ` 切换到终端

资源管理器

为了实现全键盘操作资源管理器,需要在 keybindings.json 中加入如下配置

// 全局配置
{
	"key": "ctrl e",
	"command": "workbench.view.explorer",
	"when": "viewContainer.workbench.view.explorer.enabled"
},
// --- 资源管理器中对文件或目录的操作
// 新建文件
{
	"key": "a",
	"command": "explorer.newFile",
	"when": " explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus ",
	"args": {
		"isCaseSensitive": true
	}
},
// 新建目录
{
	"key": "f",
	"command": "explorer.newFolder",
	"when": " explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus "
},
// 刷新资源管理器
{
	"key": "r",
	"command": "workbench.files.action.refreshFilesExplorer",
	"when": " explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus "
},
// 重命名文件或目录
{
	"key": "r",
	"command": "renameFile",
	"when": " explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus "
},
// 删除文件或目录
{
	"key": "d",
	"command": "deleteFile",
	"when": " explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus "
},
// 剪切文件或目录
{
	"key": "x",
	"command": "filesExplorer.cut",
	"when": "explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus"
},
// 复制文件或目录
{
	"key": "y",
	"command": "filesExplorer.copy",
	"when": "explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !inputFocus"
},
// 粘贴文件或目录
{
	"key": "p",
	"command": "filesExplorer.paste",
	"when": "explorerViewletVisible && filesExplorerFocus && !explorerResourceReadonly && !inputFocus"
}

Tips: 按下 ctrl e 可以从编辑区切换到资源管理器,再按一次可以回到上次编辑的位置

代码辅助

强烈推荐 codeium,免费且适用于多个不同的编辑器,官网:codeium.com/

vscode 恢复默认设置

  1. /Users/用户名/.vscode
  2. /Users/用户名/Library/Application Support/Code

问题

  1. 开启 vim 后 vscode 闪退,尝试回退 vscode 版本解决;