✨ [Feature]: 除了例子里面element-ui，别的UI引入无法使用

[WangJueStar]

What problem does this feature solve

比如ant-design-vue，引入https://cdn.jsdelivr.net/npm/ant-design-vue@2.2.8/+esm，还有naive-ui，引入https://unpkg.com/naive-ui@version/dist/index.prod.js，但是组件无法正常展示。

What does the proposed API look like

希望能够支持其他的ui组件。

[Issues-translate-bot]

Bot detected the issue body's language is not English, translate it automatically.

---

Title: ✨ [Feature]: Except element-ui in the example, other UI introductions cannot be used

[wenmine]

@yaoyun8 帮忙看看

[Issues-translate-bot]

Bot detected the issue body's language is not English, translate it automatically.

---

@yaoyun8 help me

[ghost]

@WangJueStar 经过测试，该文件导入后在vue3项目中无法正常使用。

我们提供另外一种方案实现画布中引入（该方案不能解决预览的问题，因为预览时的依赖定义在importmap中，依然需要esm格式的cdn）：

1. 本地安装，在packages/canvas包中安装组件库，pnpm add
2. 进入packages\canvas\src\components\render\runner.js，参考@opentiny/vue的导入，遍历组件，将组件对象挂在TinyLowcodeComponent上
3. bundle.json中就不需要添加cdn地址了

   以上就可以在画布中显示组件了 以下是预览时需要的处理

4. 预览依赖的importmap配置在packages\design-core\src\preview\src\preview\importMap.js，需要手动添加
5. 预览时mockServer出码需要的参数定义在mockServer\src\services\appinfo.json，materialHistory.component中添加新增的组件，或直接把bundle.json中components复制过来

// packages\canvas\src\components\render\runner.js
import * as AntDesign from 'ant-design-vue'

Object.entries(TinyVue).forEach(([_key, component]) => {
  const { name } = component
  if (name) { // 排除工具方法等非组件
    window.TinyLowcodeComponent[name] = component
  }
})```