「豆包Marscode体验官」，MarsCode开发大型项目无压力最近用Marscode开发我的无代码开发平台brick

我正在参加「豆包MarsCode初体验」征文活动

前沿

最近用Marscode开发我的无代码开发平台brick开源项目,使用下来整体还是蛮不错的。我用家里看剧的电脑，体验了一番，效果不错，之前只要启动项目的时候，风扇呼呼的，电脑都烫手，用了下Marscode IDE，很爽。

brick项目

brick 是一个无代码开发平台，采用 React+Typescript+Lowcode-engine 开发。

项目相对来说比较大，但用Marscode运行起来，没什么压力，还比较流畅。

MrasCode IDE

先来介绍下MarsCode IDE，

豆包旗下的 AI 原生 IDE，支持智能补全、智能预测、智能问答等能力。同时提供云端开发环境，一键开箱即用

然后我们从创建项目开始，一一介绍一下。

项目创建

MarsCode有两种创建项目方式，一种是模板创建, 一种是导入git项目仓库。

模版创建

提供了多种语言模板，可以方便的快速创建项目。
导入git项目仓库

这里如果授权你的github访问，可以列出你的所有项目，也可以提供一个github地址，来访问此项目。

启动项目

进入项目后，快捷键的命令跟vscode一致

  1. pnpm i
  2. pnpm run watch:single  开启监听
  3. pnpm run dev:ui:local 启动低代码平台
  4. pnpm run dev:lc 启动物料组件

点击控制台链接，

浏览器会打开一个带有二级域名的外网地址。也可以通过网络服务标签看生成的地址

应用就可以正常访问了

IDE设置

我们在使用IDE得时候，每个人会有会有一些自己的设置，例如快捷键，代码片段等。

快捷键设置

这里要注意一下，Marscode不能在顶部菜单找到设置项目，只能通过快捷键 command+shift+p,调出设置项，选择你需要设置的。

代码片段设置

由于brick项目数据状态管理有一个统一的模版，我用代码片段管理起来了，方便我们快速使用模版。

配置用户代码片段

新建或者修改已经存在的，这里直接把你本地vscode的代码片段给粘贴过来就行，不需要重新写。

这里如果能直接同步本地vscode的配置，就更好了。

IDE AI Coding

使用了AI能力，如果是生成一些工具方法，还是比较不错的，生成之后可以直接插入到文件当中。

还有一个较复杂的场景，回答的就有点差强人意了，同样的提示词chat gpt效果比较好，是我想要的答案。

提示此场景如下

先给你了AI一段代码

export const convertToLevelTree = (data: Array<IConnectionData>) => {
  const graph: { [key: string]: string[] } = {};
  const inDegree: { [key: string]: number } = {};

  for (const item of data) {
    const { sourceId, targetId } = item;
    // 构建邻接表
    if (!graph[sourceId]) {
      graph[sourceId] = [];
    }
    graph[sourceId].push(targetId);

    // 统计入度
    if (!inDegree[targetId]) {
      inDegree[targetId] = 0;
    }
    inDegree[targetId]++;
  }

  const result: string[][] = [];
  const zeroInDegree: string[] = Object.keys(graph).filter((node) => !inDegree[node]);

  while (zeroInDegree.length) {
    const level: string[] = [];
    const nextZeroInDegree: string[] = [];

    for (const node of zeroInDegree) {
      level.push(node);

      if (graph[node]) {
        for (const neighbor of graph[node]) {
          inDegree[neighbor]--;
          if (inDegree[neighbor] === 0) {
            nextZeroInDegree.push(neighbor);
          }
        }
      }
    }

    result.push(level);
    zeroInDegree.length = 0;
    zeroInDegree.push(...nextZeroInDegree);
  }

  return result;
};

然后描述我的需求这个是convertToLevelTree方法 const treeLevelData = convertToLevelTree(connections); 这个方法是根据x6 连线生成层级关系。我需要再写一个方法，根据 convertToLevelTree 返回的内容，转成 LiteFlow EL 脚，如果当前层级有多个内容，就是IF 条件语句
生成的结果

在我没写这个方法之前，生成的内容是有点不沾边，我用chat gpt，生成的内容后，写完代码，今天在重新问了一下，发现思路和我写的是一样的，猜测AI也在学习我写的代码。