chore: 容器框架升级，修复项目命令行异常问题

apps/renderer/src/App.vue

@@ -0,0 +1,80 @@
+<script setup lang="ts">
+import { computed, watch, ref, getCurrentInstance } from 'vue'
+import { ElLoading } from 'element-plus'
+import Postmate from 'postmate'
+import { createProvider } from '@vtj/web'
+import { useQuery } from '@tanstack/vue-query'
+import { LowCodeService } from './service'
+import { getFile } from './io'
+import { request, jsonp } from '@vtj/utils'
+// import * as VtjUI from '@vtj/ui'
+
+// 响应式状态
+const renderer = ref()
+const lowCodeService = new LowCodeService()
+
+// Postmate 握手协议
+const postmate = new Postmate.Model({
+  sayHi: (data: any) => {
+    console.log('sayHi',data)
+  }
+})
+
+// 数据模型
+const model = {
+  name: '',
+  applicationId: -1,
+  projectId: -1,
+  fileId: '',
+  url: '',
+  accessToken: ''
+}
+
+// 数据查询
+const { data: file, isFetching } = useQuery({
+  queryKey: ['getFile'],
+  queryFn: async () => {
+    await postmate.then((parent) => {
+      parent.emit('some-event', 'y-code-renderer is ready')
+      Object.assign(model, parent.model)
+      localStorage.setItem('y-code-access-token', model.accessToken || '')
+    })
+
+    return getFile(model.fileId).then(() => {
+      request.useRequest((req) => {
+        req.headers.set('Authorization', `Bearer ${model.accessToken}`)
+        return req
+      })
+      const { provider, onReady } = createProvider({
+        nodeEnv: import.meta.env.NODE_ENV,
+        service: lowCodeService,
+        project: { id: model.projectId },
+        adapter: {
+          request,
+          jsonp
+        }
+      })
+      onReady(async () => {
+        const instance = getCurrentInstance()
+        instance?.appContext.app.use(provider)
+        renderer.value = await provider.getRenderComponent(model.fileId)
+      })
+    })
+  }
+})
+
+// 加载状态监控
+watch(isFetching, (newVal) => {
+  if (newVal) {
+    ElLoading.service({ text: '低代码文件加载中...' })
+  } else {
+    ElLoading.service().close()
+  }
+})
+</script>
+
+<template>
+  <div style="padding: 20px;">
+    <component :is="renderer" v-if="renderer" />
+  </div>
+</template>

apps/renderer/src/assets/vue.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>

apps/renderer/src/constants/env.ts

@@ -0,0 +1,2 @@
+// @ts-ignore
+export const currentEnv = __APP_ENV__;

apps/renderer/src/constants/index.ts

@@ -0,0 +1 @@
+export * from "./env";

apps/renderer/src/env.d.ts

@@ -0,0 +1,2 @@
+declare module '*.vue';
+declare module '*.svg';

apps/renderer/src/index.ts

@@ -0,0 +1,25 @@
+import { createApp } from 'vue';
+
+import { VueQueryPlugin } from '@tanstack/vue-query';
+import { IconsPlugin } from '@vtj/icons';
+import * as VtjUI from '@vtj/ui';
+import ElementPlus from 'element-plus';
+
+import App from './App.vue';
+
+import '@sy/web-vitals';
+
+import 'element-plus/dist/index.css';
+import '@vtj/ui/dist/style.css';
+
+const app = createApp(App);
+
+// 批量注册组件
+Object.entries(VtjUI).forEach(([name, component]) => {
+  app.component(name, component);
+});
+app
+  .use(ElementPlus)
+  .use(IconsPlugin)
+  .use(VueQueryPlugin)
+  .mount('#y-code-renderer');

apps/renderer/src/io/file.ts

@@ -0,0 +1,16 @@
+import { BlockSchema } from "@vtj/core";
+import instance from "./instance";
+
+export type LowCodeFileSchema = {
+  project_id: number;
+  publish: boolean;
+  active: boolean;
+  dsl: BlockSchema;
+  file_path?: string;
+  file_id?: string;
+};
+
+export const getFile = async (id: string): Promise<LowCodeFileSchema> => {
+  const response = await instance.get(`/api/v1/files/${id}`);
+  return response.data;
+};

apps/renderer/src/io/index.ts

@@ -0,0 +1,2 @@
+export * from "./file";
+export * from "./project";

apps/renderer/src/io/instance.ts

@@ -0,0 +1,28 @@
+import axios from "axios";
+
+// 创建独立实例
+const instance = axios.create({
+  baseURL: import.meta.env.VITE_BASE_API_URL, // 基础URL直接放在实例配置中
+});
+
+// 请求拦截器改为使用实例
+instance.interceptors.request.use(
+  (config) => {
+    // 可在此处添加统一请求头等配置
+    return config;
+  },
+  (error) => {
+    return Promise.reject(error);
+  }
+);
+
+instance.interceptors.response.use(
+  (response) => {
+    return response.data;
+  },
+  (error) => {
+    return Promise.reject(error);
+  }
+);
+// 导出实例
+export default instance;

apps/renderer/src/io/project.ts

@@ -0,0 +1,6 @@
+import instance from "./instance";
+
+export const getProject = async (id: string) => {
+  const response = await instance.get(`/api/v1/projects/${id}`);
+  return response.data;
+};

apps/renderer/src/service/index.ts

@@ -0,0 +1,43 @@
+import { type ProjectSchema, type BlockSchema, ProjectModel } from "@vtj/core";
+import { BaseService } from "@vtj/renderer";
+import { getProject, getFile as getLowCodeFile } from "@/io";
+
+let initProject: ProjectModel = {};
+
+export class LowCodeService extends BaseService {
+  public async init(project: ProjectSchema) {
+    console.log("init", project);
+    initProject = project;
+    const remoteProject = await getProject(project.id);
+    console.log("remoteProject", remoteProject);
+    const model = new ProjectModel(remoteProject);
+    const dsl = model.toDsl();
+    return Promise.resolve(dsl);
+  }
+
+  public saveProject(project: ProjectSchema): Promise<boolean> {
+    const newProject = {
+      ...project,
+      ...Object.fromEntries(
+        Object.entries(project)
+          .filter(([key]) => stringifyFields.includes(key))
+          .map(([key, value]) => [key, JSON.stringify(value)])
+      ),
+    };
+    updateProject(initProject.id, newProject);
+    const model = new ProjectModel(newProject);
+    // storage.save(`project_${model.id}`, model.toDsl());
+    return Promise.resolve(true);
+  }
+
+  public async getFile(id: string): Promise<BlockSchema> {
+    console.log("service getFile", id);
+    return getLowCodeFile(id).then((lowCodeFile) => {
+      if (lowCodeFile.dsl) {
+        return Promise.resolve(lowCodeFile.dsl as BlockSchema);
+      } else {
+        return Promise.reject(null);
+      }
+    });
+  }
+}