在VS Code中使用Emmet JS片段

4

有人成功地让Emmet JS代码片段在VS Code或Sublime中工作过吗?

来自https://dev59.com/x3LYa4cB1Zd3GeqPdOx_#16943996的解决方案对我没有用。

这是我的设置:

"emmet.includeLanguages": {
    "javascript": "javascriptreact",
    "vue-html": "html",
    "plaintext": "html"
},

这是我的snippets.json文件:

{
    "javascript": {
        "abbreviations": {
            "cl": "console.log",
            "va": "var"
        },
        "snippets": {
            "cl": "console.log",
            "va": "var"
        }
    },
    "css": {
        "snippets": {
            "cb": "color: black",
            "bsd": "border: 1px solid ${1:red}"
        }
    }
}

没有CSS、SCSS、HTML和其他内容的问题,只有JS。我尝试了缩写或片段,但是Emmet扩展会在我编写的内容周围添加HTML标签:在Javascript和javascriptreact文件中,cl变成了<cl>。
我还尝试了在语言的片段定义中使用js和javascriptreact,但没有成功。
3个回答

4

Emmet无需添加JS片段:Emmet 2.0的新概念(已在VS Code中可用;v2.0处于测试版且尚未公开发布)作为自动完成提供程序运作,因此您可以直接使用本机VS Code片段而不需要添加JS片段。


我在发布说明中迅速看到了这个功能。我很感兴趣了解Emmet的方式,以便我也可以在Sublime中使用。您能否简要指导我们如何设置VS Code内置的方式?这样问题就会得到回答。干杯! - antoni
在Sublime Text中,您应该使用与本机代码片段相同的方法。对于非HTML和非CSS语法,使用Emmet作为片段提供程序意味着您必须禁用编辑器提供的给定语法的所有本机片段,并改用Emmet。此外,ST目前使用的是旧版Emmet,它不使用自动完成,因此VSCode和ST目前通常不兼容。 - Sergey Chikuyonok

2

这里我会举一个内置于VS Code中的代码片段的例子,但它并不是我的最爱。

按下 cmd+shift+p 打开命令提示符,输入 user snippets。已经有一个示例了。取消注释,保存,然后通过键入前缀即可立即使用。

我不得不创建相同的代码片段文件,名为javascriptreact.json,以便在大多数JS文件中使用 - JavaScript React(Babel)

例如:

{
    "Test": {
        "prefix": "ts",
        "body": [
            "console.log('test')",
            "$1"
        ],
        "description": "Prints test"
    }
}

现在我已经将Emmet映射到ctrl+e,但内置代码片段仅限于智能感知功能,这并不好。我希望有一个像ctrl+e这样的快捷键,并且我非常喜欢Emmet。
如果有人知道如何使用相同的快捷键使其与Emmet配合工作,我仍然很感兴趣。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接