[[396348]]

本文轉(zhuǎn)載自微信公眾號「勾勾的前端世界  」，作者西嶺。轉(zhuǎn)載本文請聯(lián)系勾勾的前端世界公眾號。

1、基礎(chǔ)構(gòu)建-React

基礎(chǔ)應用代碼安裝

基礎(chǔ)代碼：

2、基礎(chǔ)配置 webpack.config.js

package.json 啟動命令：

3、導出微應用

4、導入應用模塊

在組件中使用

5、模塊聯(lián)邦實現(xiàn) Vue3.0 微前端架構(gòu)

完整代碼示例：modulefederationvue3: 基于模塊聯(lián)邦實現(xiàn)的 Vue3.0 微前端架構(gòu)示例 (gitee.com)

地址：https://gitee.com/xilinglaoshi1/modulefederationvue3

package.json

1)在 home 應用中導出模塊

home\webpack.config.js

2) 在 layout 應用中導入

layout\webpack.config.js

layout\src\views\About.vue

寫好基礎(chǔ)代碼及對應配置后，分別啟動 home 及 layout 兩個應用項目就可以在 layout 應用的 about 看到 home 應用中的 User 組件的內(nèi)容了。