fix: es import error、add build command(comments)、add demo designer... (#514)

* feat: add designer demo package * fix: remove useless svg assets * fix: add .js to resolve es import error * fix: add build command in comments and entry * fix: remove metaService * feat: update registry template
2024-05-27 17:27:18 +08:00 · 2024-05-27 17:27:18 +08:00 · 81fae7e85d
parent 7a583b35a6
commit 81fae7e85d
30 changed files with 675 additions and 53 deletions
--- a/designer-demo/canvas.html
+++ b/designer-demo/canvas.html
@ -0,0 +1,265 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <style type="text/css">
+      .loading-warp {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        position: fixed;
+        top: -75px;
+        bottom: 0;
+        left: 0;
+        right: 0;
+      }
+      .loading {
+        width: 60px;
+        height: 60px;
+        margin: 0 auto;
+        position: relative;
+        animation: load 3s linear infinite;
+      }
+      .loading div {
+        width: 100%;
+        height: 100%;
+        position: absolute;
+      }
+      .loading span {
+        display: inline-block;
+        width: 20px;
+        height: 20px;
+        border-radius: 50%;
+        background: #99cc66;
+        position: absolute;
+        left: 50%;
+        margin-top: -10px;
+        margin-left: -10px;
+        animation: changeBgColor 3s ease infinite;
+      }
+      @keyframes load {
+        0% {
+          transform: rotate(0deg);
+        }
+        33.3% {
+          transform: rotate(120deg);
+        }
+        66.6% {
+          transform: rotate(240deg);
+        }
+        100% {
+          transform: rotate(360deg);
+        }
+      }
+      @keyframes changeBgColor {
+        0%,
+        100% {
+          background: #99cc66;
+        }
+        33.3% {
+          background: #ffff66;
+        }
+        66.6% {
+          background: #ff6666;
+        }
+      }
+      .loading div:nth-child(2) {
+        transform: rotate(120deg);
+      }
+      .loading div:nth-child(3) {
+        transform: rotate(240deg);
+      }
+      .loading div:nth-child(2) span {
+        animation-delay: 1s;
+      }
+      .loading div:nth-child(3) span {
+        animation-delay: 2s;
+      }
+      html,
+      body,
+      div,
+      span,
+      object,
+      iframe,
+      p,
+      blockquote,
+      pre,
+      abbr,
+      address,
+      cite,
+      code,
+      del,
+      dfn,
+      em,
+      img,
+      ins,
+      kbd,
+      q,
+      samp,
+      small,
+      strong,
+      sub,
+      sup,
+      var,
+      b,
+      i,
+      dl,
+      dt,
+      dd,
+      ol,
+      ul,
+      li,
+      fieldset,
+      form,
+      label,
+      legend,
+      table,
+      caption,
+      tbody,
+      tfoot,
+      thead,
+      tr,
+      th,
+      td,
+      article,
+      aside,
+      canvas,
+      details,
+      figcaption,
+      figure,
+      footer,
+      header,
+      hgroup,
+      menu,
+      nav,
+      section,
+      summary,
+      time,
+      mark,
+      audio,
+      video {
+        margin: 0;
+        padding: 0;
+        border: 0;
+        outline: 0;
+        font-size: 100%;
+        background: transparent;
+        user-select: none;
+      }
+      html,
+      body {
+        width: 100%;
+        height: 100%;
+        min-height: 100vh;
+      }
+
+      .design-canvas {
+        margin: 0;
+        padding: 0;
+      }
+
+      body::-webkit-scrollbar {
+        width: 8px;
+        height: 8px;
+      }
+      body::-webkit-scrollbar-track,
+      body::-webkit-scrollbar-track-piece,
+      body::-webkit-scrollbar-corner {
+        background-color: transparent;
+      }
+      body::-webkit-scrollbar-thumb {
+        background-color: #dbdbdb;
+        border-radius: 4px;
+      }
+      body::-webkit-scrollbar-thumb:hover {
+        background-color: #c2c2c2;
+      }
+      .design-page {
+        display: block;
+        height: 100%;
+      }
+      .design-page > :not(:defined):empty {
+        display: flex;
+        margin: 10px;
+        align-items: center;
+      }
+      /* 此选择器表示所有未被定义的自定义元素，用来表示区块还没加载完成，并添加加载中动画 */
+      .design-page > :not(:defined):empty::before {
+        content: '';
+        display: block;
+        width: 20px;
+        height: 20px;
+        border: 3px solid #4f77ff;
+        border-top-color: transparent;
+        border-radius: 100%;
+        animation: circle infinite 0.75s linear;
+      }
+      /* 以下代码是为了保证区块还没加载完成之前不显示内部插槽内容 */
+      .design-page > :not(:defined):empty > * {
+        display: none;
+      }
+      .design-page > :not(:defined):empty::after {
+        margin-left: 10px;
+        content: '区块加载中...';
+        font-size: 16px;
+      }
+      .canvas-container {
+        background: #f1f1f1;
+        height: 100%;
+      }
+      .canvas-container .container-box {
+        background-repeat: no-repeat;
+        background-size: 1px 100%, 100% 1px;
+        background-position: 100% 0, 100% 100%;
+        position: relative;
+        height: 100%;
+        background-image: linear-gradient(-90deg, #e0e0e0, #e0e0e0), linear-gradient(-180deg, #e0e0e0, #e0e0e0);
+      }
+      .design-page .tiny-row .tiny-col:empty {
+        min-height: 30px;
+        border: 1px solid #ccc;
+      }
+      .canvas-container .container-box .container-tip {
+        background-repeat: no-repeat;
+        background-size: 1px 100%, 100% 1px;
+        background-position: initial;
+        font-size: 14px;
+        font-weight: 400;
+        height: 100%;
+        min-height: 48px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: #a7b1bd;
+        background-image: linear-gradient(-90deg, #e0e0e0, #e0e0e0), linear-gradient(-180deg, #e0e0e0, #e0e0e0);
+      }
+      .canvas-grid-bg {
+        background-image: linear-gradient(#dadada7d 1px, transparent 0),
+          linear-gradient(90deg, #dadada7d 1px, transparent 0), linear-gradient(#dadada 1px, transparent 0),
+          linear-gradient(90deg, #dadada 1px, transparent 0);
+        background-size: 11px 11px, 11px 11px, 55px 55px, 55px 55px;
+        background-color: rgb(255, 255, 255);
+      }
+      @keyframes circle {
+        0% {
+          transform: rotate(0deg);
+        }
+        100% {
+          transform: rotate(360deg);
+        }
+      }
+    </style>
+  </head>
+  <body class="design-canvas" id="app">
+    <div class="loading-warp">
+      <div class="loading">
+        <div><span></span></div>
+        <div><span></span></div>
+        <div><span></span></div>
+      </div>
+    </div>
+    <script type="module" src="./src/canvas.js"></script>
+  </body>
+</html>
--- a/designer-demo/engine.config.js
+++ b/designer-demo/engine.config.js
@ -0,0 +1,19 @@
+/**
+ * Copyright (c) 2024 - present TinyEngine Authors.
+ * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import defaultConfig from '@opentiny/tiny-engine/vite.config.js'
+import { defineConfig } from 'vite'
+
+export default {
+  viteConfig: defaultConfig(({ command }) => defineConfig({ command, mode: 'serve' })),
+  otherConfig: {}
+}
--- a/designer-demo/index.html
+++ b/designer-demo/index.html
@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + Vue</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>
--- a/designer-demo/package.json
+++ b/designer-demo/package.json
@ -0,0 +1,22 @@
+{
+  "name": "designer-demo",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "engine-cli serve",
+    "build": "engine-cli build"
+  },
+  "dependencies": {
+    "vue": "^3.4.21",
+    "@opentiny/tiny-engine": "workspace:^",
+    "@opentiny/tiny-engine-entry": "workspace:^",
+    "@opentiny/tiny-engine-canvas": "workspace:^"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.0.4",
+    "vite": "^5.2.7",
+    "@opentiny/tiny-engine-cli": "workspace:^",
+    "@opentiny/vite-plugin-generate-comments": "workspace:^"
+  }
+}
--- a/designer-demo/registry.js
+++ b/designer-demo/registry.js
@ -0,0 +1,111 @@
+/**
+ * Copyright (c) 2024 - present TinyEngine Authors.
+ * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+export default {
+  layout: { id: 'engine.layout' },
+  toolbars: [
+    {
+      id: 'engine.toolbars.logo'
+    },
+    {
+      id: 'engine.toolbars.breadcrumb'
+    },
+    {
+      id: 'engine.toolbars.media'
+    },
+    {
+      id: 'engine.toolbars.collaboration'
+    },
+    {
+      id: 'engine.toolbars.clean'
+    },
+    {
+      id: 'engine.toolbars.refresh'
+    },
+    {
+      id: 'engine.toolbars.save'
+    },
+    {
+      id: 'engine.toolbars.generate-vue'
+    },
+    {
+      id: 'engine.toolbars.preview'
+    },
+    {
+      id: 'engine.toolbars.redoundo'
+    },
+    {
+      id: 'engine.toolbars.fullscreen'
+    },
+    {
+      id: 'engine.toolbars.lock'
+    },
+    {
+      id: 'engine.toolbars.setting'
+    },
+    {
+      id: 'engine.toolbars.lang'
+    }
+  ],
+  plugins: [
+    {
+      id: 'engine.plugins.materials'
+    },
+    {
+      id: 'engine.plugins.outlinetree'
+    },
+    {
+      id: 'engine.plugins.appmanage'
+    },
+    {
+      id: 'engine.plugins.blockmanage'
+    },
+    {
+      id: 'engine.plugins.collections'
+    },
+    {
+      id: 'engine.plugins.bridge'
+    },
+    {
+      id: 'engine.plugins.i18n'
+    },
+    {
+      id: 'engine.plugins.pagecontroller'
+    },
+    {
+      id: 'engine.plugins.datasource'
+    },
+    {
+      id: 'engine.plugins.schema'
+    },
+    {
+      id: 'engine.plugins.editorhelp'
+    },
+    {
+      id: 'engine.plugins.robot'
+    }
+  ],
+  dsls: [{ id: 'engine.dsls.dslvue' }],
+  settings: [
+    {
+      id: 'engine.setting.props'
+    },
+    {
+      id: 'engine.setting.styles'
+    },
+    {
+      id: 'engine.setting.event'
+    }
+  ],
+  canvas: {},
+  utils: { id: 'engine.utils' }
+}
--- a/designer-demo/src/App.vue
+++ b/designer-demo/src/App.vue
@ -0,0 +1,15 @@
+<script setup>
+import { onMounted } from 'vue'
+import { init } from '@opentiny/tiny-engine'
+import registry from '../registry.js'
+
+onMounted(() => {
+  init('#engine-app', registry)
+})
+</script>
+
+<template>
+  <div id="engine-app"></div>
+</template>
+
+<style scoped></style>
--- a/designer-demo/src/canvas.js
+++ b/designer-demo/src/canvas.js
@ -0,0 +1,3 @@
+import { createRender } from '@opentiny/tiny-engine-canvas'
+
+createRender(window.parent.TinyGlobalConfig)
--- a/designer-demo/src/defineEntry.js
+++ b/designer-demo/src/defineEntry.js
@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2024 - present TinyEngine Authors.
+ * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import registry from '../registry.js'
+import { defineEntry } from '@opentiny/tiny-engine-entry'
+defineEntry(registry)
--- a/designer-demo/src/main.js
+++ b/designer-demo/src/main.js
@ -0,0 +1,17 @@
+/**
+ * Copyright (c) 2024 - present TinyEngine Authors.
+ * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import './defineEntry.js'
+import { createApp } from 'vue'
+import App from './App.vue'
+
+createApp(App).mount('#app')
--- a/package.json
+++ b/package.json
@ -5,7 +5,9 @@
    "preinstall": "npx only-allow pnpm",
    "dev": "pnpm run setup && concurrently 'pnpm:serve:backend' 'pnpm:serve:frontend'",
    "dev:mock": "pnpm --filter @opentiny/tiny-engine dev",
+    "dev:demo": "concurrently 'pnpm:serve:backend' 'pnpm:dev:demo:frontend'",
    "serve:frontend": "pnpm --filter @opentiny/tiny-engine serve",
+    "dev:demo:frontend": "pnpm --filter designer-demo dev",
    "serve:backend": "pnpm --filter @opentiny/tiny-engine-mock dev",
    "build:plugin": "pnpm --filter @opentiny/tiny-engine-* build",
    "build:alpha": "pnpm --filter @opentiny/tiny-engine build:alpha",
--- a/packages/build/vite-plugin-generate-comments/package.json
+++ b/packages/build/vite-plugin-generate-comments/package.json
@ -2,10 +2,13 @@
  "name": "@opentiny/vite-plugin-generate-comments",
  "version": "1.0.0",
  "description": "",
-  "main": "index.js",
-  "module": "index.js",
-  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "files": [
+    "dist"
+  ],
  "scripts": {
+    "build": "vite build",
    "test": "node ./src/test/index.js"
  },
  "devDependencies": {
--- a/packages/build/vite-plugin-generate-comments/vite.config.js
+++ b/packages/build/vite-plugin-generate-comments/vite.config.js
@ -0,0 +1,32 @@
+/**
+ * Copyright (c) 2023 - present TinyEngine Authors.
+ * Copyright (c) 2023 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import { defineConfig } from 'vite'
+import path from 'path'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [],
+  publicDir: false,
+  resolve: {},
+  build: {
+    lib: {
+      entry: path.resolve(__dirname, './index.js'),
+      name: 'plugin-generate-comments',
+      fileName: 'index',
+      formats: ['es', 'cjs']
+    },
+    rollupOptions: {
+      external: ['vue', /@babel\/.*/, /@opentiny\/tiny-engine.*/, /@opentiny\/vue.*/]
+    }
+  }
+})
--- a/packages/design-core/assets/rf-resources/flowchart-ecs.svg
+++ b/packages/design-core/assets/rf-resources/flowchart-ecs.svg
@ -1,8 +0,0 @@
-<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve" width="132px" height="132px">
-<g>
-	<circle cx="31.5" cy="26.5" r="1.5"/>
-	<path d="M33.8,34H13.4c-0.3,0-0.5,0.2-0.5,0.5s0.2,0.5,0.5,0.5h20.5c0.3,0,0.5-0.2,0.5-0.5S34.1,34,33.8,34z"/>
-	<path d="M31.5,22h-15C14,22,12,24,12,26.5s2,4.5,4.5,4.5h15c2.5,0,4.5-2,4.5-4.5S34,22,31.5,22z M31.5,30h-15&#10;&#9;&#9;c-1.9,0-3.5-1.6-3.5-3.5s1.6-3.5,3.5-3.5h15c1.9,0,3.5,1.6,3.5,3.5S33.4,30,31.5,30z"/>
-	<path d="M35.3,16.1C33.7,11.4,29.3,8,24,8s-9.7,3.4-11.3,8.1C6.7,16.7,2,21.8,2,28c0,6.6,5.4,12,12,12h20&#10;&#9;&#9;c6.6,0,12-5.4,12-12C46,21.8,41.3,16.7,35.3,16.1z M34,38H14C8.5,38,4,33.5,4,28c0-5.1,3.8-9.4,8.9-9.9c0.8-0.1,1.4-0.6,1.7-1.3&#10;&#9;&#9;c1.4-4,5.2-6.7,9.4-6.7s8,2.7,9.4,6.7c0.3,0.7,0.9,1.2,1.7,1.3c5.1,0.6,8.9,4.8,8.9,9.9C44,33.5,39.5,38,34,38z"/>
-</g>
-</svg>
--- a/packages/design-core/assets/rf-resources/flowchart-evs.svg
+++ b/packages/design-core/assets/rf-resources/flowchart-evs.svg
@ -1,8 +0,0 @@
-<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve" width="132px" height="132px">
-<g>
-	<circle cx="14" cy="8" r="1.5"/>
-	<circle cx="34.8" cy="8" r="1.5"/>
-	<path d="M28.4,21.1C27.7,19.3,26,18,24,18s-3.7,1.3-4.4,3.1c-2.3,0.3-4.1,2.2-4.1,4.6c0,2.6,2.1,4.6,4.6,4.6h7.7&#10;&#9;&#9;c2.6,0,4.6-2.1,4.6-4.6C32.5,23.3,30.7,21.4,28.4,21.1z M27.9,29.4h-7.7c-2,0-3.6-1.6-3.6-3.6c0-1.9,1.4-3.4,3.2-3.6&#10;&#9;&#9;c0.4,0,0.7-0.3,0.8-0.7C21.1,20,22.5,19,24,19s2.9,1,3.4,2.4c0.1,0.4,0.5,0.6,0.8,0.7c1.8,0.2,3.2,1.8,3.2,3.6&#10;&#9;&#9;C31.5,27.7,29.9,29.4,27.9,29.4z"/>
-	<path d="M34,2H14c-3.3,0-6,2.7-6,6v32c0,3.3,2.7,6,6,6h20c3.3,0,6-2.7,6-6V8C40,4.7,37.3,2,34,2z M38,40&#10;&#9;&#9;c0,2.2-1.8,4-4,4H14c-2.2,0-4-1.8-4-4V8c0-2.2,1.8-4,4-4h20c2.2,0,4,1.8,4,4V40z"/>
-</g>
-</svg>
--- a/packages/design-core/assets/rf-resources/flowchart-rds.svg
+++ b/packages/design-core/assets/rf-resources/flowchart-rds.svg
@ -1,3 +0,0 @@
-<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve" width="132px" height="132px">
-<path d="M43.4,24.8l-7.8-4.5v-9.5c0-1.7-1.1-3.7-2.6-4.5l-6.4-3.7c-1.5-0.8-3.7-0.8-5.2,0L15,6.3&#10;&#9;c-1.5,0.8-2.6,2.8-2.6,4.5v9.5l-7.8,4.5C3.1,25.6,2,27.6,2,29.3v7.9c0,1.7,1.1,3.7,2.6,4.5l6.4,3.7c0.7,0.4,1.7,0.6,2.6,0.6&#10;&#9;s1.8-0.2,2.6-0.6l7.8-4.5l7.9,4.5c0.7,0.4,1.7,0.6,2.6,0.6s1.8-0.2,2.6-0.6l6.4-3.7c1.5-0.8,2.6-2.8,2.6-4.5v-7.9&#10;&#9;C46,27.6,44.9,25.7,43.4,24.8z M24,39.5L24,39.5L24,39.5L24,39.5z M16.2,8.3l6.4-3.7c0.8-0.4,2.1-0.4,2.9,0l6.4,3.7&#10;&#9;c0.7,0.4,1.4,1.6,1.4,2.5v10.1l-7.6,4.3c0,0,0,0-0.1,0c-0.4-0.4-1-0.7-1.6-0.7c-0.6,0-1.2,0.3-1.7,0.7c0,0,0,0,0,0c0,0,0,0-0.1,0&#10;&#9;l-7.5-4.3V10.8C14.7,9.9,15.4,8.8,16.2,8.3z M15,43.3c-0.8,0.4-2.1,0.4-2.9,0l-6.4-3.7C5,39.2,4.3,38,4.3,37.2v-7.9&#10;&#9;c0-0.9,0.7-2,1.4-2.5l8.4-4.8l-0.1-0.1l7.6,4.4c0,0,0.1,0,0.1,0c-0.1,0.2-0.1,0.4-0.1,0.6c0,1.1,0.7,2,1.7,2.3c0,0,0,0,0,0.1v0v9.3&#10;&#9;L15,43.3z M43.7,37.2c0,0.9-0.7,2-1.4,2.5l-6.4,3.7c-0.8,0.4-2.1,0.4-2.9,0l-8.4-4.8l0,0v-9.3c0,0,0-0.1,0-0.1&#10;&#9;c1-0.3,1.7-1.2,1.7-2.2c0-0.2,0-0.4-0.1-0.6c0,0,0,0,0.1,0l7.6-4.4L33.8,22l8.4,4.8c0.7,0.4,1.4,1.6,1.4,2.5V37.2z"/>
-</svg>
--- a/packages/design-core/assets/rf-resources/flowchart-vpc.svg
+++ b/packages/design-core/assets/rf-resources/flowchart-vpc.svg
@ -1,3 +0,0 @@
-<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve" width="132px" height="132px">
-<path d="M35.3,16.1C33.7,11.4,29.3,8,24,8c-5.3,0-9.7,3.4-11.3,8.1C6.7,16.7,2,21.8,2,28c0,6.6,5.4,12,12,12h20&#10;&#9;c6.6,0,12-5.4,12-12C46,21.8,41.3,16.7,35.3,16.1z M23.5,19.9c0,0.2,0.1,0.4,0.2,0.6l-6.6,7c-0.1-0.1-0.3-0.1-0.5-0.1l-2.5-9.8&#10;&#9;L23.5,19.9z M34,38H14C8.5,38,4,33.5,4,28c0-5.1,3.8-9.4,8.9-9.9c0.1,0,0.3-0.1,0.4-0.1l2.4,9.5c-0.4,0.3-0.7,0.7-0.7,1.2&#10;&#9;c0,0.8,0.7,1.5,1.5,1.5c0.8,0,1.5-0.7,1.5-1.5c0-0.2-0.1-0.5-0.2-0.7l6.6-7c0.2,0.1,0.4,0.1,0.6,0.1c0.8,0,1.5-0.7,1.5-1.5&#10;&#9;c0-0.8-0.7-1.5-1.5-1.5c-0.5,0-1,0.3-1.2,0.7l-9.1-2.4c1.5-3.9,5.2-6.5,9.4-6.5c4.3,0,8,2.7,9.4,6.7c0.3,0.7,0.9,1.2,1.7,1.3&#10;&#9;c5.1,0.6,8.9,4.8,8.9,9.9C44,33.5,39.5,38,34,38z"/>
-</svg>
--- a/packages/design-core/index.js
+++ b/packages/design-core/index.js
@ -13,7 +13,7 @@
 import { defineEntry } from '@opentiny/tiny-engine-entry'
 import { createApp } from 'vue'
 import EngineApp from './src/index.js'
-import defaultResigry from './registry.js'
+import defaultRegistry from './registry.js'
 import { merge } from 'lodash-es'
 import initSvgs from '@opentiny/tiny-engine-svgs'
 import { setGlobalConfig } from '@opentiny/tiny-engine-controller'
@ -33,7 +33,7 @@ const type = (obj) => {

 const mergeRegistry = (registry) => {
  Object.entries(registry).forEach(([key, value]) => {
-    const defaultConfig = defaultResigry[key]
+    const defaultConfig = defaultRegistry[key]
    if (Array.isArray(value) && defaultConfig) {
      value.forEach((meta, index) => {
        const defaultMeta = defaultConfig.find((item) => item.id === meta.id)
@ -47,7 +47,8 @@ const mergeRegistry = (registry) => {
      registry[key] = merge(defaultConfig, registry[key])
    }
  })
-
+  console.log('default registry:', defaultRegistry)
+  console.log('merged registry:', registry)
  return registry
 }

--- a/packages/design-core/scripts/localCdnFile/copyBundleDeps.js
+++ b/packages/design-core/scripts/localCdnFile/copyBundleDeps.js
@ -1,14 +1,14 @@
 import path from 'node:path'
 import fs from 'fs-extra'
-import { installPackageTemporary } from '../vite-plugins/installPackageTemporary'
-import { configServerAddProxy } from '../vite-plugins/configureServerAddProxy'
+import { installPackageTemporary } from '../vite-plugins/installPackageTemporary.js'
+import { configServerAddProxy } from '../vite-plugins/configureServerAddProxy.js'
 import { viteStaticCopy } from 'vite-plugin-static-copy'
 import {
  getCdnPathNpmInfoForSingleFile,
  getPackageNeedToInstallAndFilesUsingSameVersion,
  dedupeCopyFiles,
  copyfileToDynamicSrcMapper
-} from './locateCdnNpmInfo'
+} from './locateCdnNpmInfo.js'

 const { readJsonSync } = fs

--- a/packages/design-core/scripts/localCdnFile/copyImportMap.js
+++ b/packages/design-core/scripts/localCdnFile/copyImportMap.js
@ -5,9 +5,9 @@ import {
  dedupeCopyFiles,
  getCdnPathNpmInfoForPackage,
  getCdnPathNpmInfoForSingleFile
-} from './locateCdnNpmInfo'
-import { importmapPlugin } from '../externalDeps'
-import { installPackageTemporary } from '../vite-plugins/installPackageTemporary'
+} from './locateCdnNpmInfo.js'
+import { importmapPlugin } from '../externalDeps.js'
+import { installPackageTemporary } from '../vite-plugins/installPackageTemporary.js'

 export const copyLocalImportMap = ({
  importMap,
--- a/packages/design-core/scripts/localCdnFile/copyPreviewImportMap.js
+++ b/packages/design-core/scripts/localCdnFile/copyPreviewImportMap.js
@ -6,9 +6,9 @@ import {
  dedupeCopyFiles,
  getCdnPathNpmInfoForPackage,
  getCdnPathNpmInfoForSingleFile
-} from './locateCdnNpmInfo'
+} from './locateCdnNpmInfo.js'
 import { viteStaticCopy } from 'vite-plugin-static-copy'
-import { installPackageTemporary } from '../vite-plugins/installPackageTemporary'
+import { installPackageTemporary } from '../vite-plugins/installPackageTemporary.js'

 const { readJsonSync } = fs

--- a/packages/design-core/scripts/localCdnFile/index.js
+++ b/packages/design-core/scripts/localCdnFile/index.js
@ -1,6 +1,6 @@
-export * from './copyBundleDeps'
-export * from './copyImportMap'
-export * from './copyPreviewImportMap'
-export * from './utils'
-export * from './locateCdnNpmInfo'
+export * from './copyBundleDeps.js'
+export * from './copyImportMap.js'
+export * from './copyPreviewImportMap.js'
+export * from './utils.js'
+export * from './locateCdnNpmInfo.js'
 export * from './replaceImportPath.mjs'
--- a/packages/design-core/vite.config.js
+++ b/packages/design-core/vite.config.js
@ -84,7 +84,6 @@ const config = {
    vueJsx(),
    createSvgIconsPlugin({
      iconDirs: [
-        path.resolve(__dirname, './assets/rf-resources/'), // 脚手架执行构建时将图元图片拷贝到此目录
        path.resolve(__dirname, './assets/')
      ],
      symbolId: 'icon-[name]',
--- a/packages/engine-cli/template/registry.js
+++ b/packages/engine-cli/template/registry.js
@ -14,15 +14,98 @@ export default {
  layout: { id: 'engine.layout' },
  toolbars: [
    {
-      id: 'engine.toolbars.download'
+      id: 'engine.toolbars.logo'
+    },
+    {
+      id: 'engine.toolbars.breadcrumb'
+    },
+    {
+      id: 'engine.toolbars.media'
+    },
+    {
+      id: 'engine.toolbars.collaboration'
+    },
+    {
+      id: 'engine.toolbars.clean'
    },
    {
      id: 'engine.toolbars.refresh'
+    },
+    {
+      id: 'engine.toolbars.save'
+    },
+    {
+      id: 'engine.toolbars.generate-vue'
+    },
+    {
+      id: 'engine.toolbars.preview'
+    },
+    {
+      id: 'engine.toolbars.redoundo'
+    },
+    {
+      id: 'engine.toolbars.fullscreen'
+    },
+    {
+      id: 'engine.toolbars.lock'
+    },
+    {
+      id: 'engine.toolbars.setting'
+    },
+    {
+      id: 'engine.toolbars.lang'
+    }
+  ],
+  plugins: [
+    {
+      id: 'engine.plugins.materials'
+    },
+    {
+      id: 'engine.plugins.outlinetree'
+    },
+    {
+      id: 'engine.plugins.appmanage'
+    },
+    {
+      id: 'engine.plugins.blockmanage'
+    },
+    {
+      id: 'engine.plugins.collections'
+    },
+    {
+      id: 'engine.plugins.bridge'
+    },
+    {
+      id: 'engine.plugins.i18n'
+    },
+    {
+      id: 'engine.plugins.pagecontroller'
+    },
+    {
+      id: 'engine.plugins.datasource'
+    },
+    {
+      id: 'engine.plugins.schema'
+    },
+    {
+      id: 'engine.plugins.editorhelp'
+    },
+    {
+      id: 'engine.plugins.robot'
    }
  ],
-  plugins: [{ id: 'engine.plugins.i18n' }, { id: 'engine.plugins.status' }],
  dsls: [{ id: 'engine.dsls.dslvue' }],
-  settings: [],
+  settings: [
+    {
+      id: 'engine.setting.props'
+    },
+    {
+      id: 'engine.setting.styles'
+    },
+    {
+      id: 'engine.setting.event'
+    }
+  ],
  canvas: {},
  utils: { id: 'engine.utils' }
 }
--- a/packages/entry/package.json
+++ b/packages/entry/package.json
@ -2,8 +2,13 @@
  "name": "@opentiny/tiny-engine-entry",
  "version": "1.0.0",
  "description": "",
-  "main": "index.js",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "files": [
+    "dist"
+  ],
  "scripts": {
+    "build": "vite build",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
--- a/packages/entry/vite.config.js
+++ b/packages/entry/vite.config.js
@ -0,0 +1,32 @@
+/**
+ * Copyright (c) 2023 - present TinyEngine Authors.
+ * Copyright (c) 2023 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import { defineConfig } from 'vite'
+import path from 'path'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [],
+  publicDir: false,
+  resolve: {},
+  build: {
+    lib: {
+      entry: path.resolve(__dirname, './index.js'),
+      name: 'tiny-engine-entry',
+      fileName: () => 'index.js',
+      formats: ['es']
+    },
+    rollupOptions: {
+      external: ['vue', /@opentiny\/tiny-engine.*/, /@opentiny\/vue.*/]
+    }
+  }
+})
--- a/packages/layout/src/index.vue
+++ b/packages/layout/src/index.vue
@ -34,10 +34,9 @@
  </div>
 </template>

-<script lang="jsx">
-/* metaService */
-import './index.less'
+<script>
 import { shallowRef, ref, reactive } from 'vue'
+import './index.less'

 export default {
  props: {
--- a/packages/layout/vite.config.js
+++ b/packages/layout/vite.config.js
@ -27,6 +27,12 @@ export default defineConfig({
      name: 'layout',
      fileName: () => 'index.js',
      formats: ['es']
+    },
+    rollupOptions: {
+      output: {
+        banner: 'import "./style.css"'
+      },
+      external: ['vue', /@opentiny\/tiny-engine.*/, /@opentiny\/vue.*/]
    }
  }
 })
--- a/packages/plugins/i18n/meta.js
+++ b/packages/plugins/i18n/meta.js
@ -1,4 +1,5 @@
 import { iconLanguage } from '@opentiny/vue-icon'
+
 export default {
  id: 'engine.plugins.i18n',
  title: '国际化',
--- a/packages/plugins/i18n/src/Main.vue
+++ b/packages/plugins/i18n/src/Main.vue
@ -119,7 +119,6 @@
 </template>

 <script lang="jsx">
-/* metaService */
 import { computed, ref, watchEffect, reactive, onMounted, nextTick, resolveComponent } from 'vue'
 import useClipboard from 'vue-clipboard3'
 import { Grid, GridColumn, Input, Popover, Button, FileUpload, Loading, Tooltip, Select } from '@opentiny/vue'
@ -128,7 +127,7 @@ import { PluginPanel, LinkButton, SearchEmpty } from '@opentiny/tiny-engine-comm
 import { useTranslate, useApp, useModal, getGlobalConfig, useHelp } from '@opentiny/tiny-engine-controller'
 import { utils } from '@opentiny/tiny-engine-utils'
 import { useHttp } from '@opentiny/tiny-engine-http'
-// import { BASE_URL } from '@opentiny/tiny-engine-controller/js/environments'
+import { BASE_URL } from '@opentiny/tiny-engine-controller/js/environments'

 export default {
  components: {
@ -289,7 +288,7 @@ export default {
    }

    const downloadFile = () => {
-      // window.open(`${BASE_URL}src/app/public/i18n-mock/i18n-template-for-batch-import.zip`)
+      window.open(`${BASE_URL}src/app/public/i18n-mock/i18n-template-for-batch-import.zip`)
    }

    const openDeletePopover = (row) => {
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@ -1,5 +1,7 @@
 packages:
  - 'packages/**'
  - 'mockServer'
-  # 忽略测试文件夹中的 project
+  - 'designer-demo'
+  # 忽略测试文件夹中的 project、脚手架模板
  - '!packages/**/test/**'
+  - '!packages/**/template/**'