vite配置模块联邦

一、MF 引出下面两个概念：

• 服务：系统中引用了其他模块的应用，并定义为当前组件
  • 设备：模块被其他设备所采用，并定义为远程设备

二、在vite中配置---在host端加载remote端导出的页面

2.1 安装 @originjs/vite-plugin-federation

vite-plugin-federation 是一个专为 VITE 开发的应用程序，并专注于支持多个独立构建的应用程序能够以组件形式各自展示自己的能力，并整合到整个应用程序中。这些应用程序彼此之间没有相互依赖关系，在开发和部署时可以完全独立进行操作。这一功能的设计灵感源自 Webpack 5 中的模块联邦特性（Module Federation）。该工具通过整合 VITE 和 Rollup 提供的 Hock, 对构建文件进行干预操作, 最终将所有远程模块的组件汇总到 remoteEntry.js. 而本地模块则可以直接通过该入口加载三方组件以及已编译好的 JS、CSS 等文件。

 // 使用npm

    
 npm install  @originjs/vite-plugin-federation --save-dev
    
  
    
 // 使用yarn
    
 yarn add  @origi