MorJS globalComponentsConfig

2024-01-23 11:14 更新
是否必填 参数类型 默认值 参数含义
object 点击查看 用于配置 小程序组件=>web 组件 的映射表

背景补充说明:将小程序的代码转换成 Web 端的一个前提是,我们需要在 Web 端 1:1 实现小程序支持的组件。在编译过程中维护了一张映射表,在编译的过程中将小程序的组件进行替换,比如 view 组件,我们将其替换成了 tiga-view,那么 tiga-view 从哪里来呢?实际上,我们在 1:1 实现小程序的时候使用了 Web Components(选用 Google 开源的 lit),所以我们只需要在项目运行时,在顶部将 tiga-view 这个自定义组件注册就可以正常使用了。

如果我们遇到了以下场景我们可能会考虑使用 globalComponentsConfig 配置:

  1. Web端 需要通过条件编译渲染一些小程序不支持的组件,这个组件直接使用 web-components 实现;
  2. MorJS 提供的组件实现和支付宝小程序是一致的,无法定制,需要使用 web-components 实现一些定制组件。

需要注意的是,如果要配置此项,你需要将自定义的 web-components 提前注册,一般要么自定义 entry,要么在 htmlOptions 配置中自定义 templateContent,然后在顶部引入。以上两个配置接下来我们都会介绍

配置示例 🌰:

...
web: {
  globalComponentsConfig: {
    'view': 'custom-view', // 将 view 映射到自定义的 custom-view 组件
  }
}
...


以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号