- 參考鏈接https://github.com/originjs/vite-plugin-federation/blob/main/README-zh.md，里面也有dome可以進行查看
- webpack也有這個插件，比vite好用，vite不支持本地，必須要打包后開啟服務才可以
- 先下載(只要用到的項目都需要進行下載)
npm install @originjs/vite-plugin-federation --save-dev
1、新建兩個vite+vue的項目（one,two項目名）
- one項目中（主）----vite.config.js
image.png
注意： 上面圖片中的shared這個里面要把你組件中使用到的插件進行添加，如組件中使用路由，vuex，ui框架等，在接收的時候也要添加上，這樣就不會進行報錯了，如果你遇到跨域的問題，那就將遠程的項目進行npm run preview后進行使用服務路徑調(diào)試，生產(chǎn)的時候記得進行切換到你線上的路徑就行
image.png
- 完事之后，進行npm run build & npm run preview 此時將這個打包后的服務鏈接拿上
2、two項目中（調(diào)用主項目中的組件）---vite.config.js
image.png
-
在App.vue中進行調(diào)用組件
image.png 在進行npm run build & npm run preview就可以了
-
在實際項目中遇到過一個問題，vue打包后在生產(chǎn)環(huán)境中提示ui組件個別的組件是undefined，找不到（目前還沒有找到是什么原因了）: 解決方法，用到的項目中將ui框架都進行下載到項目中，圖片下選中的進行刪除就可以了
image.png
