零基础用Trae开发VS Code插件，其实很简单

先聊聊Trae：AI编程助手到底是什么？

不知道你有没有听说过Trae这个工具？简单来说，它就是一个能帮你写代码的AI助手。

想象一下：你只需要把需求说清楚，它就能自动生成完整的代码；遇到bug了，你直接问它，它还能帮你调试、修复，甚至自动写测试用例验证修复效果。

今天跟大家分享一个真实案例——我是怎么用Trae从零开发一个VS Code插件的。

我们要做什么？自定义Markdown格式化工具

先聊聊需求吧。很多朋友在处理Markdown文档时，可能都遇到过这样的问题：从一些文档平台导出的Markdown文件，会带着字体样式等额外信息，导入到其他编辑器或博客系统后，排版看起来总是不太规整，而普通的格式化工具又无法完全解决这些个性化需求。

所以就有了做一个个性化Markdown格式化工具的想法，主要功能包括：

1. 按自定义规则清理内容

• 删掉那些特定的HTML标签（比如<font>标签，会让文档排版显得凌乱、影响阅读体验）
• 移除多余的符号（像**这种加粗符号，根据需求进行处理）
• 清理标题里的序号（把### 1.2 标题变成干净的### 标题）
• 删除所有的分隔线（比如---）

2. 智能处理换行和空行

• 不管你用Windows还是Linux系统，换行符都能正常处理
• 自动在标题后面加空行，让文档看起来更舒服
• 在代码块前后也加上空行，方便阅读
• 调整列表项之间的间距，保持一致性

3. 控制空行数量

• 把多个连续的空行合并成一个
• 确保不同内容之间有合适的间距

简单举个例子

比如有一段这样的内容：

### 1.2 标题
<font color=red>红色文字</font>
**加粗内容**
---

格式化后就变成了：

### 标题

红色文字
加粗内容

是不是清爽多了？

用Trae开发：从需求到代码，其实很简单

接下来，就用Trae来实现这个插件。

首先，我把上面的需求描述清楚告诉Trae，然后它就开始自动帮我生成代码了。整个过程就像和一个经验丰富的程序员聊天一样简单。

很快，Trae就帮我生成了完整的项目结构：

markdown-formatter  # 项目目录
│  .gitignore        # 告诉Git哪些文件不用提交
│  .vscodeignore     # 告诉VS Code哪些文件不用打包到插件里
│  debug-helper.js   # 调试辅助工具
│  extension.js      # 插件的主要逻辑
│  formatter.js      # 核心格式化功能
│  package.json      # 插件配置文件
│  README.md         # 插件说明文档
│  test-format.js    # 测试脚本
│  test.md           # 测试用的Markdown文件
│
└─.vscode           # VS Code配置目录
        launch.json  # 调试配置
        tasks.json   # 任务配置

代码修改：有问题直接问Trae

Trae生成的代码已经很完整了，但有时候我们可能需要做一些调整。这时候，你只需要直接问Trae就行。

比如，我发现某个功能实现得不太对，就可以直接说：”Trae，我发现代码中有个问题，这个地方应该怎么修改？”

Trae会立刻理解我的问题，然后给出具体的修改建议。

更厉害的是，Trae还会自动帮我写测试用例来验证修改是否正确。比如它自动生成了test-merge-lines.js这个测试脚本，用来测试合并空行的功能。

如果第一次修改没达到预期，Trae还会继续优化，直到符合要求为止。当然，偶尔也会有需要我们手动调整的情况，但这种情况很少。

打包插件：四步搞定

代码写好后，接下来需要把它打包成VS Code能安装的插件。步骤也很简单：

1. 安装打包工具：打开终端，输入npm install -g vsce，按回车安装VSCE工具
2. 执行打包命令：在项目文件夹里打开终端，输入vsce package开始打包
3. 安装插件：打开VS Code，点击插件市场右上角的”…”，选择”Install from VSIX…”，找到刚才生成的.vsix文件
4. 重启VS Code：安装完成后，重启VS Code让插件生效

测试插件：看看效果如何

插件安装好后，我们来测试一下实际效果。

打开一个Markdown文件，点击右键，选择”Format Markdown Document”，就能看到格式化的效果了。

遇到问题怎么办？这里有解决方案

开发过程中，遇到了一个小问题：按F5启动调试的时候，在调试窗口里找不到格式化命令。

因为是使用Trae开发的插件，猜测可能是Trae和VS Code的API兼容性问题导致的。

解决方法也很简单：直接跳过调试环节，按照上面的步骤打包成VSIX文件，然后安装使用就可以了。

如果遇到类似问题，你也可以尝试跳过中间步骤，直接进行打包安装。

总结：用Trae开发插件，真的很省心

对于没有太多开发经验的人来说，用Trae开发VS Code插件真的是一个很好的选择。你不需要记住复杂的API，也不需要担心代码结构问题，只需要把需求说清楚，剩下的交给Trae就好。

如果你也想开发一个属于自己的VS Code插件，不妨试试用Trae来辅助。相信我，它会让你的开发过程变得轻松愉快很多！

最后附上项目地址：https://github.com/zmyAI/vscode-plugin/markdown-formatter

本文由博客一文多发平台 OpenWrite 发布！