如何在VSCode中添加自定义代码片段?

问题描述 投票:33回答:10

是否可以在Visual Studio代码中添加自定义代码段?如果是这样,怎么样? VSCode基于Atom,所以它应该是可能的。

code-snippets visual-studio-code
10个回答
49
投票
  1. 点击> shift + command + p并输入片段
  2. 选择首选项:打开用户代码段
  3. 选择要添加自定义代码段的语言类型
  4. vscode有解释如何添加片段的注释,如下所述:> vsdoc

可以说,我们想要为GO语言打开自定义代码段。然后我们可以这样做:

  1. 点击>命令+ p
  2. 键入:go.json + enter然后登陆自定义代码段页面

片段以JSON格式定义并存储在每个用户(languageId).json文件中。例如,Markdown代码段会进入markdown.json文件。


0
投票

如果您不想处理用JSON编写代码片段,请查看Snipster。它允许您编写代码片段,就像编写代码本身一样 - 不必将每行包装在引号中,转义字符,添加元信息等。

它还允许您编写一次,随处发布。因此,您可以在VS Code,Atom和Sublime中使用您的代码段,以及将来使用更多编辑器。 More info here


35
投票

检查这个website。你可以生成vs代码,sublime文本和atom的片段。


15
投票

从版本0.10.6开始,您可以添加自定义代码段。阅读Creating your Own Snippets上的文档。您可以通过将json文件放在C:\Users\<yourUserName>\AppData\Roaming\Code\User\snippets中来查找/创建自定义片段。例如,自定义javascript片段将在\snippets\javascript.json

您还可以发布片段,这也是一个非常简洁的功能。 John Papa创建了一个很好的angular + typescript片段,你可以在marketplace中作为扩展下载。

以下是javascript for循环文档的示例代码段:

"For Loop": {
    "prefix": "for",
    "body": [
        "for (var ${index} = 0; ${index} < ${array}.length; ${index}++) {",
        "\tvar ${element} = ${array}[${index}];",
        "\t$0",
        "}"
    ],
    "description": "For Loop"
},

哪里

  • For Loop是片段名称
  • prefix定义了IntelliSense下拉列表中使用的前缀。在这种情况下。
  • body是片段内容。可能的变量是: 标签停止$ 1,$ 2 变量的$ {id}和$ {id:label}以及$ {1:label} 具有相同ID的变量已连接。
  • description是IntelliSense下拉列表中使用的描述

6
投票

有一个VsCode插件叫做:snippet creator ..

安装后,您所要做的就是:

  1. 选择要将其设为代码段的代码。
  2. 右键单击它并选择“命令调色板”(或Ctrl + Shift + P)。
  3. 写“创建片段”。
  4. 选择需要观看的文件类型以触发您的代码段快捷方式。
  5. 选择一个代码段快捷方式。
  6. 选择一个代码段名称。

就这样 ..

注意:如果要编辑代码段,可以在[fileType] .json中找到它们 示例:Ctrl + P,然后选择“javascript.json”


4
投票

到目前为止,这是一个无证件的功能,但即将推出。有一个文件夹可以添加它们,它们会出现,但它可能会更改(由于某种原因,它没有记录)。

最好的建议是将其添加到uservoice网站并等待其最终结果。但它即将到来。


3
投票

转到文件 - >首选项 - >用户代码段。选择您的首选语言。 现在键入以下代码以生成for循环片段:

  "Create for loop":{
    "prefix": "for",
    "body":[
      "for(int i = 0; i < 10; i++)",
      "{",
      "   //code goes here",
      "}"
    ],
   "description": "Creates a for loop"
  }

你完成了。 在编辑器中键入“for”并使用第一个预测。

捷径 - 1.安装Snippet-creator扩展。 2.突出显示您需要制作代码段的代码。 3.按ctrl + shift + P并在命令面板上键入“Create snippet”,然后按ENTER。 5.选择要为其创建片段的语言(例如:-CPP),然后键入 代码段名称,键入代码段快捷方式,然后键入代码段说明。 你现在很高兴。 在步骤4中输入的编辑器中键入代码段快捷方式,然后选择 首先是预测(如果没有预测,请按ctrl + space)。

希望这可以帮助 :)

注意:转到文件 - >首选项 - >用户代码段。然后选择您所使用的语言 创建了片段。你会在那里找到片段。


2
投票

您可以添加自定义脚本,转到File --> Preferences --> User Snippets。选择您的首选语言。

如果您选择Javascript,您可以看到console.log(' ');的默认自定义脚本,如下所示:

"Print to console": {
    "prefix": "log",
    "body": [
        "console.log('$1');",
        "$2"
    ],
    "description": "Log output to console"
},

1
投票

我尝试在javascriptreact.json中添加片段,但它对我没用。

我尝试将片段添加到全局范围内,它的工作方式就像魅力一样。

FILE --> Preferences --> User snippets

在这里选择New Global Snippets File,给名javascriptreact.code-snippets

对于其他语言,您可以命名为[your_longuage] .code-snippets


0
投票

VSCode在版本0.5中引入了这个,see here。片段语法遵循TextMate snippet syntax,可以在用户首选项中写入。

© www.soinside.com 2019 - 2024. All rights reserved.