MorJS 可以接入第三方的 UI 框架吗,接入的组件会一同转端吗?
2024-01-17 14:07 更新
可以,理论上(微信/支付宝)小程序原生的组件库是可以一并转换的,使用方式上,需按照对应平台的 npm 组件的规范来使用,无其他特别的要求。使用方法如下:
注意:我们内部并没有使用任何社区的组件库,各第三方 UI 框架表现不同,相关的兼容性需要具体进一步验证
- 安装需要接入的第三方 UI 框架,具体方式请参照各 UI 框架的文档
- 在配置文件
mor.config.ts
中添加对node_modules
的处理,具体配置项processNodeModules
,相关文档请查阅 MorJS 基础用法 - 配置 processNodeModules
// mor.config.ts
export default defineConfig([
...
{
name: 'alipay', // 配置名称
...,
processNodeModules: {
// 只有 npm 名称包含 @abc/alsc- 的 npm 才会被处理
include: [/@abc\/alsc\-/]
}
}
]
- 在项目中按 照组件库规范 来引用组件,或按照实际路径引用组件,比如:"@vant/weapp/popup/index" 或 "@vant/weapp/lib/popup/index"
{
"usingComponents": {
"van-button": "@vant/weapp/button/index", // 引用 @vant/weapp 的 button 组件
"van-popup": "@vant/weapp/lib/popup/index" // 引用 @vant/weapp 的 popup 组件
}
}
- 执行编译命令,用对应平台 IDE 打开对应产物即可
以上内容是否对您有帮助:
更多建议: