Emmet 扩展缩写在具有属性的 Visual Studio Code 中不起作用
Posted
技术标签:
【中文标题】Emmet 扩展缩写在具有属性的 Visual Studio Code 中不起作用【英文标题】：Emmet expand abbreviation doesn't work in Visual Studio Code with the attributes 【发布时间】：2019-04-04 14:35:19 【问题描述】：我开始在我的 Web 项目中使用 Visual Studio Code，没有 Emmet 我就活不下去，但是当我尝试使用属性扩展 html 标记中的缩写时遇到了问题。
只是一个例子。如果我写 html:5 并按 TAB 键，它会展开所有 HTML5 模板
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
</body>
</html>
并使用 id 和 class 编写标签，例如 p#id.class，它会正确生成下一段代码
<p id="id" class="class"></p>
但是当我想用方括号内的其他属性扩展相同的标签时，它不起作用。只需在代码中添加一个制表符即可。
p[align="center"]
如果我尝试使用大括号在标签中添加文本，同样的事情
pTest
你能帮我知道如何配置它，或者我的软件/扩展是否有问题？
问候，
【问题讨论】：
【参考方案1】：以上/以下描述如何配置您的 settings.json 文件以启用/配置 Emmet 的答案的进一步说明：
如果您尝试在未保存的新文档中使用 Emmet... 您必须选择一种（支持的）语言才能激活 Emmet。 （您也可以只保存文档，VSCode 会从扩展中知道您使用的是什么语言。）
当您启动一个新的编辑器选项卡时（Ctrl+N 等） -- 在空白页面的最左上角，您可能会看到：“选择一种语言以开始使用”。单击加粗的“选择一种语言”，然后选择在 Settings.json 文件中为 Emmet 配置的语言之一，如上面/下面的其他几个答案中所述。
现在，再试一次：输入 .test 并按 Tab，您应该会看到 Emmet 展开您的缩写。
【讨论】：
【参考方案2】：有同样的问题，但打字稿。
将 "typescript": "typescriptreact" 添加到 settings.json 有帮助。
"emmet.includeLanguages":
"javascript": "javascriptreact",
"typescript": "typescriptreact",
"razor": "html",
"plaintext": "pug"
显然打字稿不是 emmet 的默认设置。
【讨论】：
【参考方案3】：在 Visual Studio 代码中： 文件 > 首选项 > 设置 > 扩展 > Emmet > 在 settings.json 文件中编辑
添加以下对我有用的代码。
"emmet.triggerExpansionOnTab": true,
"files.associations": "*html":"html",
我希望它对某人有所帮助。
【讨论】：
【参考方案4】：在 Visual Studio Code 中编辑文件 settings.json 的路径 文件 > 首选项 > 设置 > 扩展 > Emmet > 在 settings.json 中编辑
find file settings.json Edit file settings.json
【讨论】：
您不是在重复 2018 年 11 月之前的回答吗？【参考方案5】：几天后，在Emmet in Visual Studio Code webpage中调查我找到了解决方案。
您需要在用户设置文件中添加下一行以使用 Tab 键扩展 Emmet 缩写：
"emmet.triggerExpansionOnTab": true
这是因为默认情况下在 Visual Studio Code 上是禁用的。
【讨论】：
将此行添加到我的 settings.json 后，我仍然遇到问题。我得到的错误是command 'emmet.expandAbbreviation' not found。
@KshitijSaraogi "emmet.expandAbbreviation" 已弃用，您需要从 settings.json 中删除并添加 "emmet.triggerExpansionOnTab" 而不是
方括号后的制表符在启用此选项时仍然不起作用
@podlec 我再次检查了我的 VS Code，我可以确认它仍在工作
值得注意的是，对我来说，错误来自引用 emmet.expandAbbreviation 的键绑定，因此其他人也可能会检查键绑定。【参考方案6】：
我认为方括号在 emmet 中不再起作用... 但是，您应该使用 p>text 作为大括号。 据我了解，它用于在元素中添加文本。
所以 p>text here 将产生<p>text here</p>
如果您仍需要更多帮助，请查看 emmet 缩写语法文档：The Emmet Docs - Abbreviations Syntax
【讨论】：
您好，感谢您的回答。我尝试了你告诉我的方法，但也不起作用。与另一个结果相同......你的意思是方括号在 Emmet 上不再起作用了吗？我检查了文档，它仍然出现在那里...... 哦，好吧...我认为您应该重新安装扩展程序...如果您检查了我发送给您的链接，它不存在 是的......事情是Visual Studio Code默认集成了Emmet 请停用扩展程序，重新加载 VS Code，然后在扩展程序商店中找到它并重新安装.... 不幸的是它不起作用。我卸载了VS Code并删除了User文件夹和AppData中与配置相关的所有文件夹，重新安装它，问题仍然存在。以上是关于Emmet 扩展缩写在具有属性的 Visual Studio Code 中不起作用的主要内容，如果未能解决你的问题，请参考以下文章