跳转到主内容
新派编程网 - 新潮编程理念,全新技术课堂!

VSCode如何使用Auto Rename Tag_VSCode Auto Rename Tag使用实践

Auto Rename Tag 插件本身不控制自动重命名逻辑,必须启用 VSCode 内置的 editor.linkedEditing 设置(默认为 false)才能同步修改开闭标签;该功能仅对 HTML/XML 等成对标签生效,JSX 需额外配置语言关联。 Auto Rename Tag 插件在 VSCode 中默认不启用重命名闭合标签行为——必须手动开启
editor.linkedEditing
,否则改开标签名时闭合标签完全不会同步。 为什么改了
但
没变? 这是最常见误解:Auto Rename Tag 插件本身不控制“自动重命名”逻辑,它只提供底层支持;真正触发同步修改的是 VSCode 内置的
editor.linkedEditing
设置。该设置默认为
false
,即使插件已安装并启用,也不会生效。 打开设置(
Ctrl+,
或
Cmd+,
),搜索
linked editing
勾选
Editor > Linked Editing
(或直接在
settings.json
中添加
"editor.linkedEditing": true
) 该功能仅对成对 HTML/XML 标签生效,不作用于自闭合标签(如
)或 JSX 中的组件标签(需额外配置) JSX 文件里
不重命名? VSCode 默认只对
html
、
xml
、
vue
等语言内置 linked editing 支持,
javascriptreact
和
typescriptreact
需手动声明语言关联。 VSCode 1.118 微软正式发布 Visual Studio Code 1.118 版本 。本次更新重点强化了 AI 开发体验与企业管理能力,其中最引人注目的是新增 Copilot CLI 远程控制功能,允许开发者通过手机或网页远程监控和接管 AI 会话 。同时,为了提高 AI 的运行性价比,新版本优化了令牌缓存策略以降低成本 。此外,1.118 版还引入了 Chronicle 本地历史追踪、TypeScript 7.0 支持以及更严格的企业级访问管控 。 下载 在
settings.json
中添加:
"editor.linkedEditing": true, "editor.linkedEditingLanguages": { "javascriptreact": ["jsx", "tsx"], "typescriptreact": ["jsx", "tsx"] }
确保文件后缀是
.jsx
或
.tsx
,且 VSCode 右下角语言模式识别正确(点击可切换) 若用 Prettier 或 ESLint 自动格式化,可能在保存时覆盖重命名结果——建议关闭格式化插件的 “on save” 重命名干预 重命名卡顿或失效的三个典型原因 不是插件坏了,大概率是环境或配置冲突: 当前光标不在开始标签的标签名内(例如停在属性值、空格或斜杠上),
linkedEditing
不会激活 标签未正确闭合(如缺失
或嵌套错乱),VSCode 无法解析配对关系 同时启用了多个标签重命名插件(如 Auto Rename Tag + Close HTML Tag + Tag Wrapper),它们可能互相劫持编辑事件,建议只保留 Auto Rename Tag + 原生
linkedEditing
真正起作用的是 VSCode 的
linkedEditing
,插件只是让这个机制在更多语言中可用;很多人调了半天插件设置,却忘了开这个开关——它藏得深,但决定一切。

相关文章