如何编写VSCode的代码片段插件

流程

GPT 一句话搞定。

1
如何编写并发布一个VSCode的代码片段(Code Snippet)插件？

要编写并发布一个 VSCode 的代码片段（Code Snippet）插件，你可以遵循以下步骤：

创建插件项目：使用 Yeoman 生成器和 VS Code 插件生成器来创建基础的插件项目结构。你可以通过运行 npm install -g yo generator-code 来安装这些工具
。

编写代码片段：在 package.json 文件中添加 snippets 贡献点，指定代码片段的语言和路径。例如：

1
2
3
4
5
6
7
8
9
10
{
  "contributes": {
    "snippets": [
      {
        "language": "javascript",
        "path": "./snippets/javascript.json"
      }
    ]
  }
}

然后，在指定的路径下创建 JSON 文件，定义你的代码片段。例如：

1
2
3
4
5
6
7
8
9
10
11
{
  "For Loop": {
    "prefix": "for",
    "body": [
      "for (let ${1:i} = 0; ${1:i} < ${2:array}.length; ${1:i}++) {",
      "\tconsole.log(${2:array}[${1:i}])",
      "}"
    ],
    "description": "A simple for loop in JavaScript"
  }
}

这段 JSON 定义了一个 JavaScript 代码片段，当用户输入 for 并触发代码片段时，会插入一个简单的 for 循环模板
。

测试插件：在 VS Code 中，使用 F5 来启动调试模式，这将打开一个新的 VS Code 窗口，其中加载了你的插件。你可以在这个窗口中测试代码片段是否按预期工作。

打包插件：使用 vsce 工具来打包你的插件。首先，全局安装 vsce 通过 npm install -g vsce。然后，在项目根目录下运行 vsce package 来生成 .vsix 文件，这是插件的安装包
。

发布插件：在 Visual Studio Code Marketplace 上注册一个发布者账号。登录后，创建一个新的插件发布，填写相关信息，并上传之前生成的 .vsix 文件。提交发布申请后，等待 VS Code Marketplace 团队审核。审核通过后，你的插件将被发布到市场上供用户下载和使用
。

维护和更新：根据用户反馈和需求，定期更新你的插件。更新插件时，修改代码和资源文件，重新打包并提交更新。

基于开源代码片段改为适合我的缩写按键

我只有左手和右手的拇指和食指可以用，而开源的代码片段插件中的缩写按键都会涉及右手其他三个手指，不太适合我，我想改成适合我的缩写按键。

本来准备想通过 GPT 搞定，写了这样的提示词：

1
2
3
4
这是一份VSCode的代码片段插件的配置，里面的<prefix>字段对应的值是代码片段的<快捷指令>。
我是一位残疾人，只有左手可以用，这份开源代码片段插件中的<prefix>的字母键盘按键很多会涉及右手的手指，不太适合我，请帮我修改<prefix>字段的值，实现如下效果：
1、<快捷指令>的字母必须仅在左手的五个手指所操控的键盘按键范围内，即仅由这部分字母组成：qwertasdfgzxcvb；
2、<快捷指令>尽量能体现<description>的语义内容，方便记忆。
1
2
3
4
不对，出现了很多qwertasdfgzxcvb之外的字母
注意：
1、<快捷指令>的字母必须仅在左手的五个手指所操控的键盘按键范围内，即仅由这部分字母组成：qwertasdfgzxcvb；
2、<快捷指令>尽量能体现<body>的语义内容，方便记忆。
1
为什么你仍然输出了qwertasdfgzxcvb之外的字母，比如m、p、o、n等等？我该如何调整Prompt才能达到预期的效果？

结果一直不理想，先放一放，手动改了。

资料

JavaScript (ES6) code snippets：

https://github.com/xabikos/vscode-javascript

可以借鉴这里的代码片段。