我可以在扩展程序中以编程方式触发代码片段吗？

Question

我有一个提供一些片段的扩展。我想添加一个命令来创建一个新文件，其中的代码段会自动为用户触发。这个想法是让用户立即编辑制表位而无需任何进一步的操作。类似于：

运行命令（来自命令选项板或快捷键）
VSCode 打开一个新文件，其中包含已评估的代码段并等待用户输入的第一个制表位

我已经搜索了这些 API，但我还没有找到任何可以触发片段的东西。最相关的 API 是关于 CompletionItemProvider 的 API，可用于提供代码段。

有人知道如何自动 trigger/expand 片段吗？

Answer 1

TextEditor上还有一个insertSnippet方法，见https://code.visualstudio.com/api/references/vscode-api#TextEditor。

所以你可以这样做：

const editor = vscode.window.activeTextEditor;

// build your snippet with the SnippetString methods
const snippet = new vscode.SnippetString("option1 attr1=${2:Option 1 Placeholder 1} attr2=${3:Option 1 Placeholder 2}");

await editor.insertSnippet(snippet);

您也可以运行命令 insertSnippet 像这样：

// body of snippet here is exactly as you would write it in a keybinding
await vscode.commands.executeCommand("editor.action.insertSnippet", { "snippet": "${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE}T${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}Z" });

// the below uses a pre-existing snippet with a name 'Custom Header'
await vscode.commands.executeCommand("editor.action.insertSnippet", { "name": "Custom Header"});

最后一个 executeCommand 可以引用您在扩展中贡献的预先存在的片段。详情见下文。

所有这些命令都将在光标处插入，并根据需要在第一个制表位位置插入代码段。

在您的扩展中贡献代码片段：

在你的 package.json:

"contributes": {
  "snippets": [
    {
      "language": "javascript",
      "path": "./snippets/javascript.json"
    }
  ]
}

您在扩展程序中创建了一个名为 snippets 的文件夹，并为 javascript 个片段创建了一个名为 javascript.json 的文件。然后在该文件中使用通常的代码段格式，例如：

{
  "Custom Header2": {             // use this 'name'
    "prefix": "reactpure",
    "body": [
        "import React from 'react';",
        "import PropTypes from 'prop-types';",
        "import './${1:ComponentName}.module.css';",
        "const ${1:ComponentName} = ({ ${2:propValue=[] } }) => (",
        "<${3:rootelement}>${4:content}</${3:rootelement}>",
        ")",
        "${1:ComponentName}.propTypes = {",
        "${5:propValue}: PropTypes.string",
        "};",
        "export default ${1:ComponentName};",
        "[=13=]"
    ],
    "description": "Create a react pure component"
    }
}

然后你可以在你的扩展中使用那个name

// using an extension-contributed snippet
await vscode.commands.executeCommand("editor.action.insertSnippet", { "name": "Custom Header2"});
``

我可以在扩展程序中以编程方式触发代码片段吗？

Can I trigger a code snippet programmatically in an extension?

visual-studio-code

vscode-extensions

在您的扩展中贡献代码片段：