vscode中输入``自动将光标后面一个单词选中，左右加入<w>和</w>标签 - snippets 的命令调用

需求

vscode中输入``自动将光标后面一个单词选中，左右加入和标签

步骤0 准备需要安装插件

• vim - 这里的点击两次按键激活的快捷键，这个插件可以设置
• macros - 一次执行多个命令的插件
  
  
  
  
  
  snippets - vscode自带

步骤1 创建snippets模板

• ctrl + shift + p
  
  
• snippets: Configure User Snippets
• 选择你要激活的模板，这里我们选择vue-html.json文件
  
  

添加代码

"addHtmlW": {
		"prefix": "addHtmlW",
		"body": [
			"<w>$TM_SELECTED_TEXT</w>",
		],
		"description": "addHtmlW"
	}

步骤2 添加批处理命令 macros

ctrl + shift + p 输入 setting.json 回车 添加

"macros": {
    "addHtmlW": [
      "cursorWordEndRightSelect",
      {
        "command": "editor.action.insertSnippet",
        "args": { "name": "addHtmlW" }
      },
      "workbench.action.files.save",
    ],
  }

这样就添加了一个叫 addHtmlW的macros命令

• 第一步是向右选择一个单词 默认快捷键是 ctrl+shift+→
• 第二步是调用snippet命令

步骤3 绑定vim快捷键

ctrl + shift + p 输入 setting.json 回车 添加

"vim.insertModeKeyBindings": [
    {
      "before": ["`", "`"],
      "commands": ["macros.addHtmlW"]
    },
  ],

• 这里是在插入模式里面的快捷键
• 因为这个快捷键使用频率很高，所以ctrl之类的也不想按了