VSCode优秀插件推荐 - Auto Rename Tag

小甲鱼的二师兄 · 发表于 2023-12-19 01:39:29

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

本帖最后由小甲鱼的二师兄于 2023-12-19 02:19 编辑

VSCode优秀插件推荐 - Auto Rename Tag

Auto Rename Tag 是一个在 VSCode 中使用的插件，它可以自动重命名配对的 HTML/XML 标签，使得修改一个标签的名称时，对应的闭合标签也会自动更新。

屏幕截图 2023-12-19 013647.png

安装 Auto Rename Tag 插件非常简单，只需在 VSCode 的扩展市场中搜索 "Auto Rename Tag"，然后点击安装即可。

使用 Auto Rename Tag 插件的方法如下：

在编辑 HTML/XML 文件时，当你修改一个标签的名称时，对应的闭合标签的名称也会自动更新。

可以通过直接编辑标签名称或者使用重命名快捷键来触发自动重命名。

Auto Rename Tag 插件还提供了一些配置选项，可以根据个人需求进行设置。

例如，可以设置插件在哪些语言中生效，如 HTML、XML、PHP、JavaScript 等。

FishC · 发表于 2023-12-19 01:39:43

除了自动重命名配对的 HTML/XML 标签之外，Auto Rename Tag 插件还具有其他一些功能。例如，它可以在 CSS 文件中重命名类名和 ID 名称。

在使用VSCode时，你可以按下 `Ctrl + Shift + X` 打开插件面板，然后搜索并安装`Auto Rename Tag`插件。

安装完成后，当你编辑HTML/XML或CSS文件时，只需将光标放在一个开始标签上，然后修改标签的名称，插件会自动更新与之匹配的闭合标签。同样，如果你在CSS文件中重命名一个类名或ID名称，所有引用该名称的地方也会自动更新。

使用这个插件可以大大提高HTML/XML和CSS文件的开发效率，减少手动修改标签和类名的工作量。

以下是一个示例：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Auto Rename Tag</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<h1>Hello, World!</h1>
</div>
</body>
</html>

复制代码

在上面的示例中，如果我将 `container` 修改为 `wrapper`，插件会自动更新其他所有引用该类名的地方。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。

账号		自动登录	找回密码
密码			立即注册

[技术交流] VSCode优秀插件推荐 - Auto Rename Tag

马上注册，结交更多好友，享用更多功能^_^

本帖被以下淘专辑推荐: