visual-studio-code - vscode 片段变量

Question

"snippet with class binding":{
    "prefix": "row.${variable}",
    "body":[
        "<table class=\"row ${same_variable_here}\">",
        "\t<tr>",
        "\t\t<td>",
        "\t\t\t$0",
        "\t\t</td>",
        "\t</tr>",
        "</table>"
    ]
}

是否可以(如果可以的话如何)创建像some_entity.classname这样的变量 扩展到类似这样的内容(例如在 html 中):

<div class="classname"></div>

Answer 1

您似乎有两个问题。是的，emmet展开会自动转 div.myClass进入<div class="myClass"></div> 。请参阅emmet in vscode 。

您的另一个问题是关于用于全表扩展的 emmet 片段。请参阅custom emmet snippets 。在您的 settings.json 中，您将需要:

  "emmet.extensionsPath": "C:\\Users\\Mark\\.vscode\\extensions"

它应该指向一个文件夹，其中包含您将创建的名为 snippets.json 的新文件。 。在该文件中放入:

{
  "html": {
    "snippets": {
        "tableR": 
          "table.row.$1>tr>td"
    }
  }
}

使用除“tableR ”之外的任何前缀。然后你必须重新加载 vscode。然后输入您的前缀和制表符以展开(假设您的设置中有 emmet 制表符展开设置。]

[编辑]:根据您下面的评论，也许您正在寻找像带有键绑定(bind)的片段这样简单的东西:

{
    "key": "ctrl+alt+n",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
      "snippet": "${TM_SELECTED_TEXT/(.*)\\.(.*)/<$1 class=\"$2\"><\\/$1>/}"
    }
},

因此，如果您选择 anyTag.someClass变成<anyTag class="someClass"></anyTag> 当您使用您选择的任何键绑定(bind)时。 Emmet 不在这里涉及，这只是 keybindings.json 中的一个简单的键绑定(bind)(如果您愿意，您可以将其限制为某些语言)。 Emmet 扩展不允许您转换其前缀(上面的正则表达式)，就像普通片段可以抓取所选内容或当前单词并对其进行转换一样。