/federation

vite 模块联邦 demo

Primary LanguageTypeScript

  /
 ├── host 本地模块
 └── remote 远程模块

两边都是靠的vite-plugin-federation插件实现组件的导入、导出。

由于懒得再写一个服务端程序,就直接用 vscode 的Live Server 插件起了个静态服务,

在 remote 打包后,在 host 运行yarn dev即可见到效果。

remote

远程模块另外还引入了vite-plugin-dts进行声明文件的打包,

但 dts 插件只能按源码结构打包出多个声明文件,

所以就自己写了个脚本remote/scripts/dts.ts在生成声明文件之后把这些打包到一个 d.ts 里面,

并且根据传入的 federation 插件配置替换里面的模块名,让客户端有正确的类型提示

host

由于 ts 不支持远程类型导入,

客户端也是另外写了一个脚本host/scripts/tss.js,用来同步远程的声明文件,

运行yarn tss即可将声明文件下载到本地的src/typings目录