chore: vtj 依赖更新，微应用集成 postmate

2025-02-26 17:26:19 +08:00
parent 11018965bd
commit f7468bde86
22 changed files with 1581 additions and 1035 deletions
--- a/apps/renderer/package.json
+++ b/apps/renderer/package.json
@@ -1,8 +1,9 @@
 {
  "name": "@sy/low-code-renderer",
  "version": "1.0.0",
+  "type": "module",
  "scripts": {
-    "dev": "farm start",
+    "dev": "farm dev",
    "start": "farm start",
    "build": "farm build",
    "preview": "farm preview",
@@ -12,14 +13,17 @@
    "clean": "rimraf node_modules"
  },
  "dependencies": {
+    "@iframe-resizer/child": "^5.3.3",
    "@sy/low-code-shared": "workspace:*",
    "@sy/web-vitals": "workspace:*",
-    "@vtj/core": "^0.9.30",
-    "@vtj/materials": "^0.9.30",
-    "@vtj/renderer": "^0.9.30",
+    "@vtj/core": "^0.10.4",
+    "@vtj/icons": "0.10.4",
+    "@vtj/materials": "^0.10.4",
+    "@vtj/renderer": "^0.10.4",
    "core-js": "^3.40.0",
    "element-plus": "^2.9.4",
    "licia-es": "^1.46.0",
+    "postmate": "^1.5.2",
    "rrweb": "2.0.0-alpha.4",
    "vue": "^3.5.13"
  },
@@ -27,7 +31,7 @@
    "@farmfe/cli": "^1.0.4",
    "@farmfe/core": "^1.6.6",
    "@sy/vite-plugin-http2-proxy": "workspace:*",
-    "@vitejs/plugin-vue": "^5.2.1",
-    "vite-plugin-mkcert": "^1.17.6"
+    "vite-plugin-mkcert": "^1.17.6",
+    "@vitejs/plugin-vue": "^5.2.1"
  }
 }
--- a/apps/renderer/src/App.vue
+++ b/apps/renderer/src/App.vue
@@ -1,12 +1,19 @@
 <script setup lang="ts">
+import { onMounted } from 'vue';
+import Postmate from 'postmate';
 import { createRenderer } from '@vtj/renderer'
 import { type BlockSchema } from '@vtj/core'

 const dsl: BlockSchema = {
-  "name": "Tes",
+  "name": "ProjectList",
  "locked": false,
  "inject": [],
-  "state": {},
+  "state": {
+    "editModalVisible": {
+      "type": "JSExpression",
+      "value": "false"
+    }
+  },
  "lifeCycles": {},
  "methods": {},
  "computed": {},
@@ -17,90 +24,220 @@ const dsl: BlockSchema = {
  "slots": [],
  "dataSources": {},
  "__VTJ_BLOCK__": true,
-  "__VERSION__": "1739787968332",
-  "id": "45t6ex2qh",
+  "__VERSION__": "1740469448492",
+  "id": "cmc7fwbj7e",
  "nodes": [
    {
-      "id": "esmzkcp2p",
-      "name": "ElButton",
+      "id": "lvv6dsl62",
+      "name": "ElTable",
      "from": "element-plus",
      "invisible": false,
      "locked": false,
-      "children": "按钮",
+      "children": [
+        {
+          "id": "pfh43lnvu",
+          "name": "ElTableColumn",
+          "from": "element-plus",
+          "invisible": false,
+          "locked": false,
+          "children": "",
+          "props": {
+            "prop": "id",
+            "label": "项目 id",
+            "fixed": "left",
+            "index": 1
+          },
+          "directives": [],
+          "events": {}
+        },
+        {
+          "id": "sz31teqlm",
+          "name": "ElTableColumn",
+          "from": "element-plus",
+          "invisible": false,
+          "locked": false,
+          "children": [],
+          "props": {
+            "prop": "name",
+            "label": "项目名称"
+          },
+          "directives": [],
+          "events": {}
+        },
+        {
+          "id": "wiozj7tbe",
+          "name": "ElTableColumn",
+          "from": "element-plus",
+          "invisible": false,
+          "locked": false,
+          "children": [
+            {
+              "id": "2320850l3f",
+              "name": "ElButton",
+              "from": "element-plus",
+              "invisible": false,
+              "locked": false,
+              "slot": {
+                "name": "default",
+                "params": [
+                  "row",
+                  "column",
+                  "$index"
+                ]
+              },
+              "children": "编辑",
+              "props": {
+                "type": "primary",
+                "size": "small",
+                "plain": false,
+                "text": true,
+                "bg": false,
+                "loadingIcon": "Loading",
+                "icon": "Edit"
+              },
+              "directives": [],
+              "events": {
+                "click": {
+                  "name": "click",
+                  "handler": {
+                    "type": "JSFunction",
+                    "value": "() => {\r\n    console.log('window', window)\r\n    console.log('this.context.row', this.context.row)\r\n    // this.state.editModalVisible = true\r\n    const routers = this.$router.getRoutes()\r\n    console.log('routers', routers)\r\n    console.log('this.$router', this.$router)\r\n}"
+                  },
+                  "modifiers": {}
+                }
+              }
+            }
+          ],
+          "props": {
+            "prop": "address",
+            "label": "操作",
+            "fixed": "right"
+          },
+          "directives": [],
+          "events": {}
+        }
+      ],
      "props": {
-        "type": "primary"
+        "data": [
+          {
+            "id": "1",
+            "name": "miniapp",
+            "actions": {
+              "edit": true
+            }
+          },
+          {
+            "id": "2",
+            "name": "mobile",
+            "actions": {
+              "edit": true
+            }
+          },
+          {
+            "id": "3",
+            "name": "web",
+            "actions": {
+              "edit": true
+            }
+          }
+        ],
+        "size": "small",
+        "highlightCurrentRow": true,
+        "show-summary": false,
+        "lazy": true,
+        "scrollbar-always-on": true,
+        "flexible": true,
+        "stripe": true,
+        "showHeader": true
      },
      "directives": [],
+      "events": {}
+    },
+    {
+      "id": "8l081hgwdy",
+      "name": "AModal",
+      "from": "ant-design-vue",
+      "invisible": false,
+      "locked": false,
+      "children": [
+        {
+          "id": "8ojtz79z3q",
+          "name": "p",
+          "from": "",
+          "invisible": false,
+          "locked": false,
+          "children": "Some contents...",
+          "props": {},
+          "directives": [],
+          "events": {}
+        },
+        {
+          "id": "8s3fwx31ti",
+          "name": "p",
+          "from": "",
+          "invisible": false,
+          "locked": false,
+          "children": "Some contents...",
+          "props": {},
+          "directives": [],
+          "events": {}
+        },
+        {
+          "id": "8vn1umw4ja",
+          "name": "p",
+          "from": "",
+          "invisible": false,
+          "locked": false,
+          "children": "Some contents...",
+          "props": {},
+          "directives": [],
+          "events": {}
+        }
+      ],
+      "props": {
+        "open": true,
+        "title": "Basic Modal"
+      },
+      "directives": [
+        {
+          "id": "9v357t0ryi",
+          "name": "vIf",
+          "value": {
+            "type": "JSExpression",
+            "value": "this.state.editModalVisible"
+          }
+        }
+      ],
      "events": {
-        "click": {
-          "name": "click",
+        "cancel": {
+          "name": "cancel",
          "handler": {
            "type": "JSFunction",
-            "value": "() => {\r\n    console.log('1231111')\r\n}"
+            "value": "() => {\r\n    this.state.editModalVisible = false\r\n}"
+          },
+          "modifiers": {}
+        },
+        "ok": {
+          "name": "ok",
+          "handler": {
+            "type": "JSFunction",
+            "value": "() => {\r\n    this.state.editModalVisible = false\r\n}"
          },
          "modifiers": {}
        }
      }
-    },
-    {
-      "id": "26lluhulco",
-      "name": "ElImage",
-      "from": "element-plus",
-      "invisible": false,
-      "locked": false,
-      "children": [],
-      "props": {
-        "style": {
-          "width": "100px",
-          "height": "100px"
-        },
-        "src": "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
-        "previewSrcList": [
-          "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
-          "https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg",
-          "https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg",
-          "https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg",
-          "https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg",
-          "https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg",
-          "https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg"
-        ]
-      },
-      "directives": [],
-      "events": {}
-    },
-    {
-      "id": "45t6mmt7r",
-      "name": "ElDialog",
-      "from": "element-plus",
-      "invisible": false,
-      "locked": false,
-      "children": "对话框弹窗内容",
-      "props": {
-        "title": "标题",
-        "modelValue": true
-      },
-      "directives": [],
-      "events": {}
-    },
-    {
-      "id": "7pf44qdhl",
-      "name": "ElContainer",
-      "from": "element-plus",
-      "invisible": false,
-      "locked": false,
-      "children": [],
-      "props": {
-        "style": {
-          "width": "100%",
-          "height": "100%"
-        }
-      },
-      "directives": [],
-      "events": {}
    }
  ]
 };

+onMounted(() => {
+const handshake = new Postmate.Model({});
+
+handshake.then(parent => {
+  parent.emit('sync-context', 'Hello, World!');
+  });
+});
+
 const { renderer } = createRenderer({
  dsl,
 });
--- a/apps/renderer/src/index.ts
+++ b/apps/renderer/src/index.ts
@@ -1,9 +1,10 @@
 import { createApp } from "vue";
 import "@sy/web-vitals";
+import { IconsPlugin } from "@vtj/icons";
 // import "@sy/low-code-shared/styles/reset.css";

 import App from "./App.vue";
 import ElementPlus from "element-plus";
 import "element-plus/dist/index.css";

-createApp(App).use(ElementPlus).mount("#low-code-renderer");
+createApp(App).use(ElementPlus).use(IconsPlugin).mount("#low-code-renderer");
--- a/apps/renderer/tsconfig.json
+++ b/apps/renderer/tsconfig.json
@@ -1,25 +1,18 @@
 {
  "compilerOptions": {
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "module": "ESNext",
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "jsx": "preserve",
-
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["src/*"],
+      "$vtj/*": [".vtj/*"]
+    }
  },
-  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"],
-  "references": [{ "path": "./tsconfig.node.json" }]
-}
+  "include": ["src"],
+  "exclude": [".vtj"],
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ]
+}
--- a/apps/renderer/tsconfig.node.json
+++ b/apps/renderer/tsconfig.node.json
@@ -4,8 +4,7 @@
    "skipLibCheck": true,
    "module": "ESNext",
    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true,
-    "strict": true
+    "allowSyntheticDefaultImports": true
  },
-  "include": ["farm.config.ts"]
+  "include": ["vite.config.ts"]
 }
--- a/apps/renderer/vite.config.ts
+++ b/apps/renderer/vite.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from "vite";
+import http2Proxy from "@sy/vite-plugin-http2-proxy";
+import mkcert from "vite-plugin-mkcert";
+import VuePlugin from "@vitejs/plugin-vue";
+
+export default defineConfig({
+  server: {
+    port: 10010,
+  },
+  plugins: [http2Proxy(), mkcert(), VuePlugin()],
+});