html - VSCode Emmet 标识不能正确处理 Svelte 文件

Question

我想了解如何让 Emmet 在 .svelte 上正常工作文件。
当我使用 PHP 文件或 HTML 文件时，不会遇到此问题。

当我使用简单的 Emment 缩写时，例如 div , 输入后的输出对于两种语言 ( <div>|</div> ) 是相同的，光标位于 block 的中间。

使用 HTML 文件可以正常工作；所以在按下 enter 后， block 将被格式化(| 代表光标):

<div>
    |
</div>

在使用 .svelte 时这不起作用:

<div>
|</div>

即使在 .svelte 中，我如何告诉 Emmet 缩进代码？扩展名？我试过在 settings.json 中使用它, 但不起作用:

"emmet.includeLanguages": {
    "svelte": "html"
}

Answer 1

这实际上取决于您希望 emmet 在 Svelte 中为您做什么。 如果您只是在寻找 html 标记快捷方式，这将起作用:

"emmet.includeLanguages": {
        "svelte": "html",
        
    }
}

这将为您提供您习惯于在 HTML 文件中拥有的 html 标准 emmet。它也不会干扰其他扩展程序读取您的文件的方式。

我将不得不做更多的修补才能让它做更多的事情。但是，如果您正在寻找 Svelte 特定功能，请查看 Svelte for VS Code 扩展。该扩展将具有类似于 Svelte 特定代码块的 emmet 的功能列表，范围限定在可以使用它们的地方。例如，脚本标签之间将为您提供 Svelte 特定功能 (JS)。在放置 HTML 的部分中，您将获得其他 block ，包括条件、动画等。