Module Federation là gì? Hoạt động như thế nào?

Module Federation là tính năng của Webpack 5 cho phép một app (host) nạp code từ app khác (remote) ngay lúc runtime, kèm cơ chế chia sẻ dependency — đây là nền tảng phổ biến nhất để dựng micro-frontend hiện nay.

Remote khai báo những module nó chia sẻ ra ngoài (exposes); host khai báo các remotes muốn dùng và shared để dùng chung một bản thư viện như React.

// remote (app product)
new ModuleFederationPlugin({
  name: 'product', filename: 'remoteEntry.js',
  exposes: { './Card': './src/Card' },
  shared: { react: { singleton: true } },
})

Host import động product/Card qua URL của remoteEntry.js.

• Rspack và Vite cũng có plugin tương đương.
• Lưu ý: nếu cấu hình shared sai (không đặt singleton: true) thì host và remote nạp hai bản React khác nhau → lỗi "invalid hook call".