在我的自定义片段中使用 TM_SELECTED_TEXT

Question

随着 2016 年 11 月（1.8 版）发布的 VSCode片段变量，现在支持，特别是 TM_SELECTED_TEXT。

这让我很高兴，因为我在 Sublime Text 和 TextMate 中大量使用了这些。

我不知道如何让它在 VSCode 中工作。 我创建了他们用作示例的代码段：

"in quotes": {
    "prefix": "inq",
    "body": "'${TM_SELECTED_TEXT:${1:type_here}}'"
}

然后我输入一些文本，突出显示它，这就是事情开始破裂的地方。

这个想法是突出显示一些文本，运行代码段，然后用突出显示的文本替换${TM_SELECTED_TEXT:${1:type_here}} 。 我遇到的问题是，要运行代码段，您需要键入prefix值（在本例中为inq ）以运行代码段，该代码段会覆盖突出显示的文本，从而使一切变得混乱。

在 Sublime/Textmate 中，我从键盘组合中启动了代码片段，突出显示了我的文本。

在 VSCode 中，有没有一种方法可以使这项工作保持原样，或者像 Sublime 中提供的那样从组合键中启动代码片段？

Answer 1

在 1.49 中（在本次编辑时，它在 Insiders' Build 中）您的示例最终将按您的预期工作。 请参阅合并的拉取请求。

Vscode 现在将“记住”您选择的文本（如果有），并且当您输入代码段前缀时，即使您似乎过度输入了所选文本，也将其插入到TM_SELECTED_TEXT变量中。

---

从 v1.20 开始，由于添加了新变量 $CLIPBOARD，这变得更加容易，请参阅新的代码段变量。 因此无需分配和运行快捷方式 - 但您必须将选择复制到剪贴板CTRL - C 。

您的示例现在可以是：

"in quotes": {
    "prefix": "inq",
    "body": "'$CLIPBOARD:${1:type_here}'"
}

注意： $CLIPBOARD有效。 不需要额外的大括号{$CLIPBOARD} 。

Answer 2

突出显示单词后，按F1并运行命令“插入代码段”，然后在列表中选择您的代码段。

您也可以通过转到File > Preferences > Keyboard Shortcuts来编辑您的键绑定，并向“editor.action.showSnippets”命令添加一些快捷方式，如下所示：

{
    "key": "ctrl+alt+s",
    "command": "editor.action.showSnippets",
    "when": "editorTextFocus"
}

Answer 3

https://github.com/Microsoft/vscode/issues/17780

根据此线程，您可以通过提供args为键绑定分配精确的片段。 引导媒体查询的键绑定示例

{
    "key": "ctrl+alt+b",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
        "name": "bsup"
    }
},
{
    "key": "ctrl+alt+shift+b",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
        "name": "bsup_copy"
    }
},

片段示例

"bsup": {
    "prefix": "bsup",
    "body": [
        "@include media-breakpoint-up(md){",
        "\t${TM_SELECTED_TEXT}",
        "}"
    ],
    "description": "Bootstrap media up"
},
"bsup_copy": {
    "prefix": "bsup_copy",
    "body": [
        "${1:${TM_SELECTED_TEXT}}",
        "@include media-breakpoint-up(md){",
        "\t${2:${TM_SELECTED_TEXT}}",
        "}"
    ],
    "description": "Bootstrap media up + copy selected text"
},

UPD：此外 -您可以直接在keybindings.json定义片段，这在某些情况下对我来说似乎更方便

{
  "key": "cmd+shift+c",
  "command": "editor.action.insertSnippet",
  "when": "editorTextFocus",
  "args": {
     "snippet": "console.log('${TM_SELECTED_TEXT}', $TM_SELECTED_TEXT$1);"
  }
}

Answer 4

使用https://code.visualstudio.com/docs/editor/userdefinedsnippets 中的文档，我能够自定义片段，我正在使用“环绕”扩展名，并且可以将我自己的片段放入 settings.json 中，如下所示：

"html_h3-name": {
  "label": "h3",
  "description": "wrap by h3 with <a name=''>, top",
  "snippet": "<h3><a name=\"${TM_SELECTED_TEXT/[\\s]/-/g}\"></a>$TM_SELECTED_TEXT\n\t<a class=\"small\" href=\"#top\">top</a>\n</h3>"

},

它采用 VSCode 中突出显示的代码并从中创建带有名称链接的 h3 标头：

it converts  'aaa bbb ccc' to 
<h3><a name="aaa-bbb-ccc"></a>aaa bbb ccc
    <a class="small" href="#top">top</a>
</h3>