用了 Trae 后，感觉离京东外卖不远了

前言

入手 Trae 开发已经有一段时间了，因为之前开发过一个vscode 插件，有点好奇如果让 Trae 来实现同样的功能会怎样。结果令人震惊 ------ 不到10分钟就完成了开发！这让我突然间对未来迷茫起来了。甚至觉得"送外卖的日子"似乎也不远了（说起来也巧了，今天碰巧就注册了京东众包😂）

vcode 插件介绍

我们先来看一下插件的效果

这个插件是智能代码命名工具，很多开发者在给代码命名时常常感到困扰，尤其是在英文水平有限的情况下，频繁地依赖翻译软件来寻找合适的命名。这个插件通过 AI 自动生成符合命名规范的名称，不仅避免了翻译软件带来的生硬翻译，还能提供更加自然、友好的命名建议。让你的代码命名更高效、更符合语境，提升整体开发体验。

AI 实现

首先我们先对功能进行拆解

然后运行 Trae

可以看到 Trae 直接给我们生成项目结构

和插件核心代码实现

ts 复制代码

import { ExtensionContext, commands, window } from 'vscode';

function isChinese(text: string): boolean {
  return /[\u4e00-\u9fa5]/.test(text);
}

function validateText(text: string): { isValid: boolean; message?: string } {
  if (!text) {
    return { isValid: false, message: '请选择要转换的文本' };
  }
  if (!isChinese(text)) {
    return { isValid: false, message: '请选择中文文本' };
  }
  if (text.length > 20) {
    return { isValid: false, message: '选中文本不能超过20个字' };
  }
  return { isValid: true };
}

async function generateCodeName(text: string): Promise<string> {
  // TODO: 这里将集成火山引擎的AI模型
  // 临时返回一个示例转换结果
  return text.split('').join('_');
}

export async function activate(context: ExtensionContext) {
  const disposable = commands.registerCommand('vcode.generateCodeName', async () => {
    const editor = window.activeTextEditor;
    if (!editor) {
      return;
    }

    const selection = editor.selection;
    const text = editor.document.getText(selection);

    const validation = validateText(text);
    if (!validation.isValid) {
      window.showErrorMessage(validation.message!);
      return;
    }

    try {
      const codeName = await generateCodeName(text);
      await editor.edit(editBuilder => {
        editBuilder.replace(selection, codeName);
      });
    } catch (error) {
      window.showErrorMessage('生成代码命名失败：' + error.message);
    }
  });

  context.subscriptions.push(disposable);
}

这段代码与我之前手动开发的版本惊人地相似，只需要补充 AI 模型调用的部分就可以完整运行了

插件地址

源码

用了 Trae 后，感觉离京东外卖不远了

前言

vcode 插件介绍

AI 实现

更多实践案例