3.0.0预览版代码首次上传。

2025-11-01 01:01:48 +08:00 · 2022-01-02 14:33:25 +08:00
parent 23615147a3
commit f9de155e83
26 changed files with 698 additions and 222 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -5,3 +5,4 @@ dist-ssr
 *.local
 /.idea/
 /.vscode/
+/stats.html
--- a/README.md
+++ b/README.md
@@ -1,7 +1,64 @@
-# Vue 3 + Vite
+# Variant Form For Vue 3预览版
+#### 一款高效的Vue低代码表单，可视化设计，一键生成源码，享受更多摸鱼时间。

-This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+### 说明
+这是一个开发预览版，仅供学习参考，请勿用于开发环境，下述问题亟待解决：
+```
+iconfont图标替换为svg未全部完成；
+多语言切换未完成；
+富文本组件修改未完成；
+```

-## Recommended IDE Setup
+### 友情链接
+[Fantastic-admin](https://hooray.gitee.io/fantastic-admin/) —— 一款开箱即用的 Vue 中后台管理系统框架（支持Vue2/Vue3）

- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
+[REBUILD](https://getrebuild.com/) —— 高度可定制化的企业管理系统
+
+### 功能一览
+```
+> 拖拽式可视化表单设计；
+> 支持PC、Pad、H5三种布局；
+> 支持运行时动态加载表单；
+> 支持表单复杂交互控制；
+> 支持自定义CSS样式；
+> 支持自定义校验逻辑；
+> 支持国际化多语言；
+> 兼容IE 11浏览器；
+> 可导出Vue组件、HTML源码；
+> 可导出Vue的SFC单文件组件；
+> 支持开发自定义组件；
+> 支持响应式自适应布局；
+> 支持VS Code插件；
+> 更多功能等你探究...；
+```
+
+
+### 安装依赖
+```
+npm install --registry=https://registry.npm.taobao.org
+```
+
+### 开发调试
+```
+npm run serve
+```
+
+### 生产打包
+```
+npm run build
+```
+
+### 表单设计器 + 表单渲染器打包
+```
+npm run lib
+```
+
+### 表单渲染器打包
+```
+npm run lib-render
+```
+
+### 浏览器兼容性
+```Chrome（及同内核的浏览器如QQ浏览器、360浏览器等等），Firefox，Safari```
+
+<br/>
--- a/package-lock.json
+++ b/package-lock.json
@@ -906,6 +906,34 @@
        "tiny-emitter": "^2.0.0"
      }
    },
+    "cliui": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
+      "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
+      "dev": true,
+      "requires": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.0",
+        "wrap-ansi": "^7.0.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+          "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "6.0.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+          "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^5.0.1"
+          }
+        }
+      }
+    },
    "clone": {
      "version": "2.1.2",
      "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
@@ -1248,6 +1276,12 @@
        "normalize-wheel-es": "^1.1.1"
      }
    },
+    "emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true
+    },
    "emojis-list": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
@@ -1583,6 +1617,12 @@
      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
      "dev": true
    },
+    "get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "dev": true
+    },
    "get-intrinsic": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.1.tgz",
@@ -1882,6 +1922,12 @@
        "kind-of": "^5.0.0"
      }
    },
+    "is-docker": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+      "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==",
+      "dev": true
+    },
    "is-extendable": {
      "version": "0.1.1",
      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
@@ -1894,6 +1940,12 @@
      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
      "dev": true
    },
+    "is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true
+    },
    "is-glob": {
      "version": "4.0.3",
      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -1948,6 +2000,15 @@
      "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==",
      "dev": true
    },
+    "is-wsl": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+      "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+      "dev": true,
+      "requires": {
+        "is-docker": "^2.0.0"
+      }
+    },
    "isarray": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
@@ -2392,6 +2453,16 @@
        "wrappy": "1"
      }
    },
+    "open": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+      "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+      "dev": true,
+      "requires": {
+        "is-docker": "^2.0.0",
+        "is-wsl": "^2.1.1"
+      }
+    },
    "parchment": {
      "version": "1.1.4",
      "resolved": "https://registry.npmjs.org/parchment/-/parchment-1.1.4.tgz",
@@ -2611,6 +2682,12 @@
      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
      "dev": true
    },
+    "require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
+      "dev": true
+    },
    "resolve": {
      "version": "1.20.0",
      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz",
@@ -2642,6 +2719,26 @@
        "fsevents": "~2.3.2"
      }
    },
+    "rollup-plugin-visualizer": {
+      "version": "5.5.2",
+      "resolved": "https://registry.npmjs.org/rollup-plugin-visualizer/-/rollup-plugin-visualizer-5.5.2.tgz",
+      "integrity": "sha512-sh+P9KhuWTzeStyRA5yNZpoEFGuj5Ph34JLMa9+muhU8CneFf9L0XE4fmAwAojJLWp//uLUEyytBPSCdZEg5AA==",
+      "dev": true,
+      "requires": {
+        "nanoid": "^3.1.22",
+        "open": "^7.4.2",
+        "source-map": "^0.7.3",
+        "yargs": "^16.2.0"
+      },
+      "dependencies": {
+        "source-map": {
+          "version": "0.7.3",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz",
+          "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==",
+          "dev": true
+        }
+      }
+    },
    "safe-buffer": {
      "version": "5.2.1",
      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
@@ -2770,6 +2867,11 @@
        }
      }
    },
+    "sortablejs": {
+      "version": "1.14.0",
+      "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.14.0.tgz",
+      "integrity": "sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w=="
+    },
    "source-map": {
      "version": "0.6.1",
      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
@@ -2867,6 +2969,34 @@
      "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM=",
      "dev": true
    },
+    "string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "requires": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+          "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "6.0.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+          "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^5.0.1"
+          }
+        }
+      }
+    },
    "string_decoder": {
      "version": "1.3.0",
      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
@@ -3270,11 +3400,90 @@
        "vue": "^3.0.11"
      }
    },
+    "wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "requires": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+          "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+          "dev": true
+        },
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "dev": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "dev": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "6.0.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+          "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^5.0.1"
+          }
+        }
+      }
+    },
    "wrappy": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
      "dev": true
+    },
+    "y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "dev": true
+    },
+    "yargs": {
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
+      "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
+      "dev": true,
+      "requires": {
+        "cliui": "^7.0.2",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^20.2.2"
+      }
+    },
+    "yargs-parser": {
+      "version": "20.2.9",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz",
+      "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==",
+      "dev": true
    }
  }
 }
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
    "element-plus": "^1.2.0-beta.5",
    "file-saver": "^2.0.5",
    "mitt": "^3.0.0",
+    "sortablejs": "1.14.0",
    "vue": "^3.0.0",
    "vue-i18n": "^9.2.0-beta.23",
    "vue3-quill": "^0.2.6"
@@ -28,6 +29,7 @@
    "ace-builds": "^1.4.12",
    "babel-eslint": "^10.1.0",
    "mvdir": "^1.0.21",
+    "rollup-plugin-visualizer": "^5.5.2",
    "sass": "^1.45.0",
    "vite": "^2.7.2",
    "vite-plugin-svg-icons": "^1.0.5"
--- a/src/components/form-designer/form-widget/field-widget/cascader-widget.vue
+++ b/src/components/form-designer/form-widget/field-widget/cascader-widget.vue
@@ -2,7 +2,8 @@
  <form-item-wrapper :designer="designer" :field="field" :rules="rules" :design-state="designState"
                     :parent-widget="parentWidget" :parent-list="parentList" :index-of-parent-list="indexOfParentList"
                     :sub-form-row-index="subFormRowIndex" :sub-form-col-index="subFormColIndex" :sub-form-row-id="subFormRowId">
-    <el-cascader ref="fieldEditor" :options="field.options.optionItems" v-model="fieldModel" class="full-width-input"
+    <el-cascader ref="fieldEditor" :options="field.options.optionItems" v-model="fieldModel"
+                 style="width: 100%" class="full-width-input"
                 :disabled="field.options.disabled"
                 :size="field.options.size"
                 :clearable="field.options.clearable"
@@ -98,7 +99,7 @@
  @import "../../../../styles/global.scss"; /* form-item-wrapper已引入，还需要重复引入吗？ */

  .full-width-input {
-    width: 100% !important;
+    width: 100% !important;  /* 没生效？？改用内联样式style */
  }

 </style>
--- a/src/components/form-designer/form-widget/field-widget/fieldMixin.js
+++ b/src/components/form-designer/form-widget/field-widget/fieldMixin.js
@@ -88,14 +88,28 @@ export default {
    },

    initEventHandler() {
-      eventBus.$on('setFormData', (newFormData) => {
+      // eventBus.$on('setFormData', (newFormData) => {
+      //   console.log('formModel of globalModel----------', this.globalModel.formModel)
+      //   if (!this.subFormItemFlag) {
+      //     this.setValue(newFormData[this.field.options.name])
+      //   }
+      // })
+      this.on$('setFormData', (newFormData) => {
        console.log('formModel of globalModel----------', this.globalModel.formModel)
        if (!this.subFormItemFlag) {
          this.setValue(newFormData[this.field.options.name])
        }
      })

-      eventBus.$on('field-value-changed', (values) => {
+      // eventBus.$on('field-value-changed', (values) => {
+      //   if (!!this.subFormItemFlag) {
+      //     let subFormData = this.formModel[this.subFormName]
+      //     this.handleOnChangeForSubForm(values[0], values[1], subFormData, this.subFormRowId)
+      //   } else {
+      //     this.handleOnChange(values[0], values[1])
+      //   }
+      // })
+      this.on$('field-value-changed', (values) => {
        if (!!this.subFormItemFlag) {
          let subFormData = this.formModel[this.subFormName]
          this.handleOnChangeForSubForm(values[0], values[1], subFormData, this.subFormRowId)
@@ -105,11 +119,17 @@ export default {
      })

      /* 监听重新加载选项事件 */
-      eventBus.$on('reloadOptionItems', (widgetNames) => {
+      // eventBus.$on('reloadOptionItems', (widgetNames) => {
+      //   if ((widgetNames.length === 0) || (widgetNames.indexOf(this.field.options.name) > -1)) {
+      //     this.initOptionItems(true)
+      //   }
+      // })
+      this.on$('reloadOptionItems', (widgetNames) => {
        if ((widgetNames.length === 0) || (widgetNames.indexOf(this.field.options.name) > -1)) {
          this.initOptionItems(true)
        }
      })
+
    },

    handleOnCreated() {
@@ -289,13 +309,15 @@ export default {

    emitFieldDataChange(newValue, oldValue) {
      //this.$emit('field-value-changed', [newValue, oldValue])
-      eventBus.$emit('field-value-changed', [newValue, oldValue])
+      //eventBus.$emit('field-value-changed', [newValue, oldValue])  //此处应该加事件触发组件判断，非本组件（其他组件）触发的事件应该跳过，否则会出现事件无限循环！！
+
+      this.emit$('field-value-changed', [newValue, oldValue])
      console.log('test', 'ccccccccc')

      // /* 必须用dispatch向指定父组件派发消息！！ */
-      // this.dispatch('VFormRender', 'fieldChange',
-      //     [this.field.options.name, newValue, oldValue, this.subFormName, this.subFormRowIndex])
-      eventBus.$emit('fieldChange', [this.field.options.name, newValue, oldValue, this.subFormName, this.subFormRowIndex])
+      this.dispatch('VFormRender', 'fieldChange',
+          [this.field.options.name, newValue, oldValue, this.subFormName, this.subFormRowIndex])
+      // eventBus.$emit('fieldChange', [this.field.options.name, newValue, oldValue, this.subFormName, this.subFormRowIndex])
    },

    syncUpdateFormModel(value) {
@@ -319,9 +341,9 @@ export default {
      //number组件一般不会触发focus事件，故此处需要手工赋值oldFieldValue！！
      this.oldFieldValue = deepClone(value)  /* oldFieldValue需要在initFieldModel()方法中赋初值!! */

-      // /* 主动触发表单的单个字段校验，用于清除字段可能存在的校验错误提示 */
-      // this.dispatch('VFormRender', 'fieldValidation', [this.field.options.name])
-      eventBus.$emit('fieldValidation', [this.field.options.name])
+      /* 主动触发表单的单个字段校验，用于清除字段可能存在的校验错误提示 */
+      this.dispatch('VFormRender', 'fieldValidation', [this.field.options.name])
+      // eventBus.$emit('fieldValidation', [this.field.options.name])
    },

    handleFocusCustomEvent(event) {
@@ -356,7 +378,7 @@ export default {

    handleOnChange(val, oldVal) {  //自定义onChange事件
      console.log('test', 'aaaaaaaaa')
-      debugger
+      //debugger

      if (!!this.field.options.onChange) {
        let changeFn = new Function('value', 'oldValue', this.field.options.onChange)
--- a/src/components/form-designer/form-widget/field-widget/input-widget.vue
+++ b/src/components/form-designer/form-widget/field-widget/input-widget.vue
@@ -14,8 +14,8 @@
              :prefix-icon="field.options.prefixIcon" :suffix-icon="field.options.suffixIcon"
              @focus="handleFocusCustomEvent" @blur="handleBlurCustomEvent" @input="handleInputCustomEvent"
              @change="handleChangeEvent">
-      <template #append>
-        <el-button v-if="field.options.appendButton" :disabled="field.options.disabled || field.options.appendButtonDisabled"
+      <template #append v-if="field.options.appendButton">
+        <el-button :disabled="field.options.disabled || field.options.appendButtonDisabled"
                   :class="field.options.buttonIcon" @click="emitAppendButtonClick"></el-button>
      </template>
    </el-input>
--- a/src/components/form-designer/form-widget/field-widget/rich-editor-widget.vue
+++ b/src/components/form-designer/form-widget/field-widget/rich-editor-widget.vue
@@ -9,6 +9,16 @@
                @focus="handleRichEditorFocusEvent" @blur="handleRichEditorBlurEvent">
    </vue-editor>
    -->
+
+    <quill-editor
+            v-model:value="fieldModel"
+            :options="editorOption"
+            :disabled="field.options.disabled"
+            @blur="handleRichEditorBlurEvent"
+            @focus="handleRichEditorFocusEvent"
+            @change="handleRichEditorChangeEvent"
+    />
+
  </form-item-wrapper>
 </template>

@@ -19,6 +29,8 @@
  import {deepClone} from "@/utils/util";
  import fieldMixin from "@/components/form-designer/form-widget/field-widget/fieldMixin";

+  import { Quill, quillEditor } from 'vue3-quill'
+
  export default {
    name: "rich-editor-widget",
    componentName: 'FieldWidget',  //必须固定为FieldWidget，用于接收父级组件的broadcast事件
@@ -55,6 +67,7 @@
      // VueEditor: resolve => { //懒加载！！
      //   require(['vue2-editor'], ({VueEditor}) => resolve(VueEditor))
      // }
+      quillEditor,
    },
    inject: ['refList', 'formConfig', 'globalOptionData', 'globalModel'],
    data() {
@@ -68,6 +81,14 @@
      }
    },
    computed: {
+      editorOption() {
+        return {
+          placeholder: this.field.options.placeholder,
+          modules: {
+            //toolbar: this.customToolbar
+          }
+        }
+      },

    },
    beforeCreate() {
--- a/src/components/form-designer/setting-panel/form-setting.vue
+++ b/src/components/form-designer/setting-panel/form-setting.vue
@@ -80,8 +80,9 @@
      </el-collapse>
    </el-form>

+    <div v-if="showFormEventDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.setting.editFormEventHandler')" v-model="showFormEventDialogFlag"
-               v-if="showFormEventDialogFlag" :show-close="true" custom-class="small-padding-dialog"
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog"
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <el-alert type="info" :closable="false" :title="'form.' + eventParamsMap[curEventName]"></el-alert>
        <code-editor :mode="'javascript'" :readonly="false" v-model="formEventHandlerCode"></code-editor>
@@ -95,9 +96,11 @@
          </div>
        </template>
      </el-dialog>
+    </div>

+    <div v-if="showEditFormCssDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.setting.formCss')" v-model="showEditFormCssDialogFlag"
-               v-if="showEditFormCssDialogFlag" :show-close="true" custom-class="small-padding-dialog"
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog"
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <code-editor :mode="'css'" :readonly="false" v-model="formCssCode"></code-editor>
        <template #footer>
@@ -109,9 +112,11 @@
          </div>
        </template>
      </el-dialog>
+    </div>

+    <div v-if="showEditFunctionsDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.setting.globalFunctions')" v-model="showEditFunctionsDialogFlag"
-               v-if="showEditFunctionsDialogFlag" :show-close="true" custom-class="small-padding-dialog"
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog"
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <code-editor :mode="'javascript'" :readonly="false" v-model="functionsCode"></code-editor>
        <template #footer>
@@ -123,6 +128,7 @@
          </div>
        </template>
      </el-dialog>
+    </div>

  </div>
 </template>
--- a/src/components/form-designer/setting-panel/index.vue
+++ b/src/components/form-designer/setting-panel/index.vue
@@ -71,8 +71,9 @@
      </el-tab-pane>
    </el-tabs>

+    <div v-if="showWidgetEventDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.setting.editWidgetEventHandler')" v-model="showWidgetEventDialogFlag"
-               v-if="showWidgetEventDialogFlag" :show-close="true" custom-class="small-padding-dialog"
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog"
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <el-alert type="info" :closable="false" :title="eventHeader"></el-alert>
        <code-editor :mode="'javascript'" :readonly="false" v-model="eventHandlerCode"></code-editor>
@@ -86,6 +87,7 @@
          </div>
        </template>
      </el-dialog>
+    </div>

  </el-container>
 </template>
@@ -100,13 +102,14 @@
  } from "@/utils/util"
  import i18n from "@/utils/i18n"
  import eventBus from "@/utils/event-bus"
+  import emitter from "@/utils/emitter";

  const {COMMON_PROPERTIES, ADVANCED_PROPERTIES, EVENT_PROPERTIES} = WidgetProperties

  export default {
    name: "SettingPanel",
    componentName: "SettingPanel",
-    mixins: [i18n],
+    mixins: [i18n, emitter],
    components: {
      CodeEditor,
      FormSetting,
@@ -178,11 +181,14 @@
    },
    created() {
      // eventBus.$on('editEventHandler', (eventName, eventParams) => {
-      //   //debugger
      //   this.editEventHandler(eventName, eventParams)
      // })

-      eventBus.$on('editEventHandler', (eventParams) => {
+      // eventBus.$on('editEventHandler', (eventParams) => {
+      //   this.editEventHandler(eventParams[0], eventParams[1])
+      // })
+
+      this.on$('editEventHandler', (eventParams) => {
        //debugger
        this.editEventHandler(eventParams[0], eventParams[1])
      })
@@ -253,7 +259,7 @@
      },

      editEventHandler(eventName, eventParams) {
-        debugger
+        //debugger

        this.curEventName = eventName
        this.eventHeader = `${this.optionModel.name}.${eventName}(${eventParams.join(', ')}) {`
--- a/src/components/form-designer/setting-panel/option-items-setting.vue
+++ b/src/components/form-designer/setting-panel/option-items-setting.vue
@@ -50,8 +50,9 @@
      <el-button type="text" @click="resetDefault">{{i18nt('designer.setting.resetDefault')}}</el-button>
    </div>

+    <div v-if="showImportDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.setting.importOptions')" v-model="showImportDialogFlag"
-               v-if="showImportDialogFlag" :show-close="true" custom-class="small-padding-dialog"
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog"
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <el-form-item>
          <el-input type="textarea" rows="10" v-model="optionLines"></el-input>
@@ -63,9 +64,11 @@
          </div>
        </template>
      </el-dialog>
+    </div>

+    <div v-if="showImportCascaderDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.setting.importOptions')" v-model="showImportCascaderDialogFlag"
-               v-if="showImportCascaderDialogFlag" :show-close="true" custom-class="small-padding-dialog"
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog"
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <code-editor v-model="cascaderOptions" mode="json" :readonly="false"></code-editor>
        <template #footer>
@@ -76,6 +79,8 @@
        </template>
      </el-dialog>
    </div>
+
+  </div>
 </template>

 <script>
--- a/src/components/form-designer/setting-panel/property-editor/event-handler/eventMixin.js
+++ b/src/components/form-designer/setting-panel/property-editor/event-handler/eventMixin.js
@@ -6,9 +6,8 @@ export default {
  created() {},
  methods: {
    editEventHandler(eventName, eventParams) {
-      //this.dispatch('SettingPanel', 'editEventHandler', [eventName, [...eventParams]])
-
-      eventBus.$emit('editEventHandler', [eventName, [...eventParams]])
+      this.dispatch('SettingPanel', 'editEventHandler', [eventName, [...eventParams]])
+      // eventBus.$emit('editEventHandler', [eventName, [...eventParams]])
    },

  }
--- a/src/components/form-designer/setting-panel/property-editor/field-cascader/cascader-defaultValue-editor.vue
+++ b/src/components/form-designer/setting-panel/property-editor/field-cascader/cascader-defaultValue-editor.vue
@@ -0,0 +1,18 @@
+<template>
+  <div style="display: none"></div>
+</template>
+
+<script>
+  export default {
+    name: "cascader-defaultValue-editor",
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>
--- a/src/components/form-designer/setting-panel/property-editor/field-checkbox/checkbox-defaultValue-editor.vue
+++ b/src/components/form-designer/setting-panel/property-editor/field-checkbox/checkbox-defaultValue-editor.vue
@@ -0,0 +1,18 @@
+<template>
+  <div style="display: none"></div>
+</template>
+
+<script>
+  export default {
+    name: "checkbox-defaultValue-editor",
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>
--- a/src/components/form-designer/setting-panel/property-editor/field-number/number-defaultValue-editor.vue
+++ b/src/components/form-designer/setting-panel/property-editor/field-number/number-defaultValue-editor.vue
@@ -10,7 +10,7 @@
  import propertyMixin from "@/components/form-designer/setting-panel/property-editor/propertyMixin"

  export default {
-    name: "defaultValue-editor",
+    name: "number-defaultValue-editor",
    mixins: [i18n, propertyMixin],
    props: {
      designer: Object,
--- a/src/components/form-designer/setting-panel/property-editor/field-radio/radio-defaultValue-editor.vue
+++ b/src/components/form-designer/setting-panel/property-editor/field-radio/radio-defaultValue-editor.vue
@@ -0,0 +1,18 @@
+<template>
+  <div style="display: none"></div>
+</template>
+
+<script>
+  export default {
+    name: "radio-defaultValue-editor",
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>
--- a/src/components/form-designer/setting-panel/property-editor/field-select/select-defaultValue-editor.vue
+++ b/src/components/form-designer/setting-panel/property-editor/field-select/select-defaultValue-editor.vue
@@ -0,0 +1,18 @@
+<template>
+  <div style="display: none"></div>
+</template>
+
+<script>
+  export default {
+    name: "select-defaultValue-editor",
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>
--- a/src/components/form-designer/toolbar-panel/index.vue
+++ b/src/components/form-designer/toolbar-panel/index.vue
@@ -41,9 +41,10 @@
      </template>
    </div>

-    <el-dialog :title="i18nt('designer.toolbar.preview')" v-model="showPreviewDialogFlag" v-if="showPreviewDialogFlag"
+    <div v-if="showPreviewDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
+      <el-dialog :title="i18nt('designer.toolbar.preview')" v-model="showPreviewDialogFlag"
                 :show-close="true" :close-on-click-modal="false" :close-on-press-escape="false" center
-               :destroy-on-close="true" custom-class="small-padding-dialog" width="75%" :fullscreen="layoutType === 'H5'">
+                 :destroy-on-close="true" custom-class="drag-dialog small-padding-dialog" width="75%" :fullscreen="layoutType === 'H5'">
        <div>
          <div class="form-render-wrapper" :class="[layoutType === 'H5' ? 'h5-layout' : '']">
            <VFormRender ref="preForm" :form-json="formJson" :form-data="testFormData" :preview-state="true"
@@ -63,6 +64,7 @@
          </div>
        </template>
      </el-dialog>
+    </div>

    <div v-if="showImportJsonDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.toolbar.importJson')" v-model="showImportJsonDialogFlag"
@@ -81,8 +83,9 @@
      </el-dialog>
    </div>

+    <div v-if="showExportJsonDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.toolbar.exportJson')" v-model="showExportJsonDialogFlag"
-               v-if="showExportJsonDialogFlag" :show-close="true" custom-class="small-padding-dialog" center
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog" center
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <code-editor :mode="'json'" :readonly="true" v-model="jsonContent"></code-editor>
        <template #footer>
@@ -95,9 +98,11 @@
          </div>
        </template>
      </el-dialog>
+    </div>

+    <div v-if="showExportCodeDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.toolbar.exportCode')" v-model="showExportCodeDialogFlag"
-               v-if="showExportCodeDialogFlag" :show-close="true" custom-class="small-padding-dialog" center
+                 :show-close="true" custom-class="drag-dialog small-padding-dialog" center
                 width="65%" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <el-tabs type="border-card" class="no-box-shadow no-padding" v-model="activeCodeTab">
          <el-tab-pane label="Vue" name="vue">
@@ -120,9 +125,11 @@
          </div>
        </template>
      </el-dialog>
+    </div>

+    <div v-if="showFormDataDialogFlag" class="" v-drag="['.nested-drag-dialog.el-dialog', '.nested-drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.hint.exportFormData')" v-model="showFormDataDialogFlag"
-               v-if="showFormDataDialogFlag" :show-close="true" custom-class="dialog-title-light-bg" center
+                 :show-close="true" custom-class="nested-drag-dialog dialog-title-light-bg" center
                 :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true"
                 :append-to-body="true">
        <div style="border: 1px solid #DCDFE6">
@@ -138,9 +145,11 @@
          </div>
        </template>
      </el-dialog>
+    </div>

+    <div v-if="showExportSFCDialogFlag" class="" v-drag="['.drag-dialog.el-dialog', '.drag-dialog .el-dialog__header']">
      <el-dialog :title="i18nt('designer.toolbar.generateSFC')" v-model="showExportSFCDialogFlag"
-               v-if="showExportSFCDialogFlag" :show-close="true" custom-class="small-padding-dialog" center
+                 v-if="showExportSFCDialogFlag" :show-close="true" custom-class="drag-dialog small-padding-dialog" center
                 width="65%" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
        <el-tabs type="border-card" class="no-box-shadow no-padding" v-model="activeSFCTab">
          <el-tab-pane label="Vue2" name="vue2">
@@ -164,6 +173,8 @@
        </template>
      </el-dialog>
    </div>
+
+  </div>
 </template>

 <script>
@@ -442,7 +453,7 @@
      doJsonImport() {
        try {
          let importObj = JSON.parse(this.importTemplate)
-          console.log('test import', this.importTemplate)
+          //console.log('test import', this.importTemplate)
          this.designer.loadFormJson(importObj)

          this.showImportJsonDialogFlag = false
--- a/src/components/form-render/container-item/sub-form-item.vue
+++ b/src/components/form-render/container-item/sub-form-item.vue
@@ -192,7 +192,8 @@
          return
        }

-        eventBus.$on('setFormData', (newFormData) => {
+        //eventBus.$on('setFormData', (newFormData) => {
+        this.on$('setFormData', (newFormData) => {
          this.initRowIdData(false)
          this.initFieldSchemaData()

--- a/src/components/form-render/index.vue
+++ b/src/components/form-render/index.vue
@@ -259,16 +259,20 @@
      },

      addFieldChangeEventHandler() {
-        eventBus.$off('fieldChange')  //移除原有事件监听
-        eventBus.$on('fieldChange', (fieldName, newValue, oldValue, subFormName, subFormRowIndex) => {
+        //eventBus.$off('fieldChange')  //移除原有事件监听
+        this.off$('fieldChange')  //移除原有事件监听
+        //eventBus.$on('fieldChange', (fieldName, newValue, oldValue, subFormName, subFormRowIndex) => {
+        this.on$('fieldChange', (fieldName, newValue, oldValue, subFormName, subFormRowIndex) => {
          this.handleFieldDataChange(fieldName, newValue, oldValue, subFormName, subFormRowIndex)
          this.$emit('formChange', fieldName, newValue, oldValue, this.formDataModel, subFormName, subFormRowIndex)
        })
      },

      addFieldValidateEventHandler() {
-        eventBus.$off('fieldValidation')  //移除原有事件监听
-        eventBus.$on('fieldValidation', (fieldName) => {
+        //eventBus.$off('fieldValidation')  //移除原有事件监听
+        this.off$('fieldValidation')  //移除原有事件监听
+        //eventBus.$on('fieldValidation', (fieldName) => {
+        this.on$('fieldValidation', (fieldName) => {
          this.$refs.renderForm.validateField(fieldName)
        })
      },
--- a/src/utils/emitter.js
+++ b/src/utils/emitter.js
@@ -1,10 +1,13 @@

 function _broadcast(componentName, eventName, params) {
  this.$children.forEach(function (child) {
-    var name = child.$options.componentName;
+    let name = child.$options.componentName;

    if (name === componentName) {
-      child.$emit.apply(child, [eventName].concat(params));
+      //child.$emit.apply(child, [eventName].concat(params));
+      if (!!child.emit$) {
+        child.emit$.call(child, eventName, params)
+      }
    } else {
      _broadcast.apply(child, [componentName, eventName].concat([params]));
    }
@@ -12,11 +15,46 @@ function _broadcast(componentName, eventName, params) {
 }

 export default {
+  data() {
+    return {
+      vfEvents: {}
+    }
+  },
+
  methods: {
+    emit$(eventName, data) {
+      if (this.vfEvents[eventName]) {
+        this.vfEvents[eventName].forEach((fn) => {
+          fn(data);
+        });
+      }
+    },
+
+    on$(eventName, fn) {
+      this.vfEvents[eventName] = this.vfEvents[eventName] || [];
+      this.vfEvents[eventName].push(fn);
+    },
+
+    off$(eventName, fn) {
+      if (this.vfEvents[eventName]) {
+        if ((fn === undefined) || (fn === null)) {
+          this.vfEvents[eventName].length = 0
+          return
+        }
+
+        for (let i = 0; i < this.vfEvents[eventName].length; i++) {
+          if (this.vfEvents[eventName][i] === fn) {
+            this.vfEvents[eventName].splice(i, 1)
+            break
+          }
+        }
+      }
+    },
+
    dispatch: function dispatch(componentName, eventName, params) {
-      debugger
-      var parent = this.$parent || this.$root;
-      var name = parent.$options.componentName;
+      //debugger
+      let parent = this.$parent || this.$root;
+      let name = parent.$options.componentName;

      while (parent && (!name || name !== componentName)) {
        parent = parent.$parent;
@@ -26,9 +64,13 @@ export default {
        }
      }
      if (parent) {
-        parent.$emit.apply(parent, [eventName].concat(params));
+        //parent.$emit.apply(parent, [eventName].concat(params));
+        if (!!parent.emit$) {
+          parent.emit$.call(parent, eventName, params)
+        }
      }
    },
+
    broadcast: function broadcast(componentName, eventName, params) {
      _broadcast.call(this, componentName, eventName, params);
    }
--- a/variant-form3-vite.iml
+++ b/variant-form3-vite.iml
@@ -2,7 +2,10 @@
 <module type="WEB_MODULE" version="4">
  <component name="NewModuleRootManager" inherit-compiler-output="true">
    <exclude-output />
-    <content url="file://$MODULE_DIR$" />
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/dist" />
+      <excludeFolder url="file://$MODULE_DIR$/lib" />
+    </content>
    <orderEntry type="inheritedJdk" />
    <orderEntry type="sourceFolder" forTests="false" />
  </component>
--- a/vite-lib-render.config.js
+++ b/vite-lib-render.config.js
@@ -33,7 +33,8 @@ export default defineConfig({
  },

  optimizeDeps: {
-    //include: ['@/../lib/vuedraggable/dist/vuedraggable.umd.js']
+    include: ['@/../lib/vuedraggable/dist/vuedraggable.umd.js', 'quill']
+    //include: ['quill']
  },

  css: {
--- a/vite-lib.config.js
+++ b/vite-lib.config.js
@@ -4,6 +4,7 @@ import vueJsx from '@vitejs/plugin-vue-jsx'
 import viteSvgIcons from 'vite-plugin-svg-icons'
 import { resolve } from 'path'
 import commonjs from '@rollup/plugin-commonjs'
+import visualizer from 'rollup-plugin-visualizer'

 // https://vitejs.dev/config/
 export default defineConfig({
@@ -16,6 +17,9 @@ export default defineConfig({
    //解决引入commonjs模块后打包出现的{'default' is not exported by XXX}错误!!
    commonjs(),

+    //可视化Bundle
+    visualizer(),
+
    viteSvgIcons({
      // Specify the icon folder to be cached
      iconDirs: [resolve(process.cwd(), 'src/icons/svg')],
@@ -33,7 +37,8 @@ export default defineConfig({
  },

  optimizeDeps: {
-    //include: ['@/../lib/vuedraggable/dist/vuedraggable.umd.js']
+    include: ['@/../lib/vuedraggable/dist/vuedraggable.umd.js', 'quill']
+    //include: ['quill']
  },

  css: {
--- a/vite.config.js
+++ b/vite.config.js
@@ -33,7 +33,7 @@ export default defineConfig({
  },

  optimizeDeps: {
-    include: ['@/../lib/vuedraggable/dist/vuedraggable.umd.js']
+    include: ['@/../lib/vuedraggable/dist/vuedraggable.umd.js', 'quill']
  },

  css: {
--- a/许可条款.txt
+++ b/许可条款.txt
@@ -0,0 +1,8 @@
+# Variant Form 许可条款 1.0
+
+1. 免责声明：任何情况下根据任何法律，本作者不对用户因使用VariantForm产生的侵权、数据损坏丢失、软硬件故障和违法犯罪等问题承担任何责任；
+2. 禁止任何用户对VariantForm进行简单包装后，即声称为自己的产品、并销售源码获利；
+3. VariantForm不是公开开源项目，获取到源代码的用户可自由修改源码供自身开发使用，也可以分发build构建后的库代码，但不可分发VariantForm源代码，本作者保留VariantForm核心代码的著作权；
+4. 个人或公司用户均可将VariantForm项目应用于商业项目开发，为支持本项目持续开发，请尽量购买源码订阅更新服务；
+5. 如果你不同意本许可条款，请勿使用VariantForm；任何情况下，一旦实际使用VariantForm，则代表你已确定完全同意本许可条款；
+6. 条款内容结束。