背景：最近在学习vue时，看到网课老师在书写template时，html代码具有自动闭合标签的功能，然后自己在网上找了许多教程，发现这样的文章很少，自己就琢磨了下，才写了这篇博客供大家参考

正文

在js文件中书写这样的模板时，能够像书写HTML文件时使用tab键自动补全html代码，即自动生成闭合标签。教程如下：

1. 依次打开 “文件 >> 首选项 >> 设置” 或者使用快捷方式：ctrl + shift + p 搜索“打开用户设置”

2. 在搜索栏中搜索 “settings.json”,点击图中红色圈中部分

3. 在配置文件中添加如下代码

"emmet.triggerExpansionOnTab": true,
"emmet.showAbbreviationSuggestions": true,
"emmet.showExpandedAbbreviation": "always",
"emmet.includeLanguages": {
"javascript": "html"
}

我的配置如下：

解释：

• emmet.triggerExpansionOnTab：启用后，按下TAB键，将展开Emmet缩写
• emmet.showAbbreviationSuggestions：将可能的Emmet缩写作为建议进行显示
• emmet.showExpandedAbbreviation：将展开的Emmet缩写作为建议进行显示
• emmet.includeLanguages：在默认不支持 Emmet 的语言中启用 Emmet 缩写功能。在此添加该语言与受支持的语言间的映射

• 点赞 3
• 收藏
• 分享
• 文章举报