VS Code中输入单词后自动添加的本质是“包围操作”而非自动补全，需先选中文本再执行Emmet: Wrap with Abbreviation命令或配置快捷键插入
vscode 输入单词后自动补全
VS Code 默认不会在你输完一个单词后“智能加尖括号”，它没这个上下文判断能力。你真正需要的是「选中后快速包裹」——也就是把已输入的文本用 和 <code>> 包起来。这属于编辑器的“环绕”（surround）行为，和自动补全（autocomplete）是两套机制。
- 常见错误现象：
console.log输完按Tab或Enter，结果啥也没发生，或弹出无关建议 - 根本原因：没有触发任何包围指令，也没有配置对应 snippet 或快捷键
- 最直接路径：先选中文本（哪怕只双击一个单词），再执行包围命令
用 Ctrl+Shift+P 调出命令面板，搜 Emmet: Wrap with Abbreviation
这是 VS Code 内置的、最可靠的方式，尤其适合临时、单次、非固定结构的包裹需求。Emmet 的 abbr 语法支持 div、ul>li*3 这类写法，但对尖括号，直接输 > 就行——注意不是 >，是英文半角右尖括号字符本身。
- 操作步骤：
双击选中单词→Ctrl+Shift+P→ 输入Wrap→ 选中Emmet: Wrap with Abbreviation→ 回车 → 输入>→ 回车 - 效果：
div变成<div>；<code>App变成<app></app> - 注意点：必须选中内容，否则会插在光标处；输入
>后回车，不是Tab；不支持自动补全，只是单边包裹 - 打开
keybindings.json（命令面板搜Preferences: Open Keyboard Shortcuts (JSON)） - 加这段：
想按一次键就完成 <xxx></xxx> + 光标停在中间？配自定义 keybindings.json
如果你高频操作（比如写 JSX、Vue 模板、XML），值得花 2 分钟配个快捷键。核心思路是：先用命令选中当前单词（editor.action.addSelectionToNextFindMatch 不适用），改用 editor.action.wordHighlight.trigger 不行——正确做法是组合 cursorWordStartLeft + cursorWordEndRight + editor.action.insertSnippet。
{
"key": "ctrl+alt+b",
"command": "editor.action.insertSnippet",
"when": "editorTextFocus && !editorReadonly",
"args": {
"snippet": "<$1>$0"
}
}
- 效果：光标在单词任意位置，按
Ctrl+Alt+B，该单词被替换成<xxx></xxx>，且光标停在和 <code>>中间（$1位置） - 兼容性：所有语言都生效；如果当前已有选区，会覆盖选区内容，不是追加
- 坑：别用
Tab作快捷键，它默认是缩进/补全键，容易冲突
别碰 autoClosingBrackets 配置，它对 基本无效
很多人搜到 "editor.autoClosingBrackets": "always"，以为开了就能自动包单词。实际它只在你**手动输入 时**尝试补 <code>>，不会监听单词输入、也不会反向推导。而且 HTML/JSX 里， 本身是高危字符，VS Code 默认甚至会禁用它的自动闭合（防 XSS 类误判）。
- 验证方法：关掉所有插件，纯默认设置下，输
div后敲，看是否补 <code>>—— 大概率不补，尤其在.js文件里 - 语言影响：在
.html或.vue的 template 区域可能生效，但依然不解决「输完单词再加」的需求 - 结论：这不是你要找的开关，调它只会浪费时间
真正卡住人的，往往是混淆了「输入时补全」和「输入后包裹」这两个动作。前者靠 language server 或 snippet 触发，后者靠编辑命令驱动——分清这点，你就不会再盯着设置项反复试了。
