Module Federation 如何实现微前端?和 qiankun 有何区别?

Module Federation(Webpack5/Vite 插件)让多个独立构建的应用在运行时互相加载对方导出的模块,天然适合微前端:

// app1 暴露组件
new ModuleFederationPlugin({ name: 'app1', filename: 'remoteEntry.js', exposes: { './Button': './src/Button' }, shared: { react: { singleton: true } } })
// app2 消费
remotes: { app1: 'app1@https://app1.com/remoteEntry.js' }
import Button from 'app1/Button'

与 qiankun 区别:

实践中两者可结合:用 MF 共享组件与依赖,用基座/路由做应用级编排。

同分类其他题目