在 VS Code 中创建自定义 HTML 片段

我正在远离织梦者 （我知道它很糟糕，但它有它的用处）用于 VS Code 的电子邮件开发。 Dreamweaver 提供的一项方便的功能是使用自定义片段。 VS Code 优惠自定义片段 https://code.visualstudio.com/docs/editor/userdefinedsnippets也是，但它的工作原理不同Dreamweaver 片段 https://helpx.adobe.com/dreamweaver/using/reuse-code-with-snippets.html据我所知，还需要付出更多的努力。下面是 VS Code 中发生的情况。

VS Code 自定义片段

{
        "Preheader": {
            "prefix": "preheader",
            "body": [
                "<span style="display:none !important; mso-hide: all; color:#FEE4DC; max-height: 0px; overflow: hidden;">text goes here</span>"
            ],
            "description": "preheader for email"
    }
}

Result

<span style=

预期结果

<span style="display:none !important; mso-hide: all; color:#FEE4DC; max-height: 0px; overflow: hidden;">text goes here</span>

看来我必须做一些转义才能得到预期的结果？这有点平凡，因为我的电子邮件开发过程中可能有大量代码:(

我是否使用 VS Code 中的正确功能来创建客户代码段？或者我错误地使用了该功能。

因此，在需要将长行代码转换为 VS 代码片段的情况下，我找到了一个很好的解决方案。这个解决方案是片段生成器应用程序 https://snippet-generator.app/。很棒的是它也有 Sublime 和 Atom 的选项。