@module-federation/vite

@module-federation/vite is the official Vite plugin for Module Federation, the runtime architecture that lets independently built and deployed applications share code at runtime. It wires Module Federation’s remote/host contract directly into Vite’s plugin and dev-server APIs, handling remote entry generation, shared-dependency deduplication, and HMR across dev and production builds.

Beyond parity with the original webpack implementation, the plugin adds Vite-specific capabilities: shared-dependency tree shaking that reduces bundles to only the exports a consumer actually uses, build-time removal of unused runtime capabilities (remote consumption, shared handling, snapshot/manifest support), and an external-runtime mode that lets multiple remotes share a single runtime-core instance instead of bundling their own. It supports Vite 5 through 8 (including the Rolldown-based bundler) and ships framework-agnostic examples for React, Vue, Svelte, Angular, Solid, Preact, Lit, Alpine, Ember, and more.

What You Get

• A federation() Vite plugin for both host and remote roles, configurable inline or via a dedicated module-federation.config.ts file
• Shared-dependency deduplication with singleton support and tree-shaking modes (runtime-infer and server-calc) to ship only the exports consumers use
• Runtime capability optimization flags (disableRemote, disableShared, disableSnapshot) that strip unused Module Federation code paths from the build
• Manifest and stats generation (mf-manifest.json, mf-stats.json) for deployment pipelines that need federation metadata
• An external-runtime mode that lets multiple remotes share one @module-federation/runtime-core instance instead of each bundling its own

Common Use Cases

• Splitting a large frontend into independently deployed micro-frontends that share a common design system and framework runtime
• Migrating an existing webpack Module Federation setup to Vite via the documented OriginJS migration path
• Serving federated remotes into SSR frameworks like Nitro or TanStack Start where the host has no static index.html to inject into
• Building multi-bundler demos where Vite, Webpack, and Rspack remotes are loaded into the same host application

Under The Hood

Architecture The plugin’s index.ts entry point acts as an orchestrator that wires a set of single-purpose Vite plugins together — pluginAddEntry, pluginProxyRemotes, pluginProxySharedModule_preBuild, pluginMFManifest, pluginDevRemoteHmr, pluginSSRRemoteEntry, pluginExternalRuntimeCore, and others — each hooking into a distinct point of Vite’s build/dev lifecycle (resolveId, transform, generateBundle). A parallel virtualModules/ layer synthesizes in-memory ES modules (remote entries, shared-import maps, runtime-init status) that Vite’s dev server and the Rollup/Rolldown bundler resolve through tagged virtual ids. Configuration normalization is isolated in normalizeModuleFederationOptions, keeping the option-shape logic separate from the plugin composition and runtime code-generation concerns.

Tech Stack Written in TypeScript and built with tsdown (a Rolldown-based bundler) into a dual ESM output. It declares vite ^5–^8 as a peer dependency and depends on sibling @module-federation packages (dts-plugin, runtime-core) for type generation and shared runtime state. The pnpm workspace also hosts framework-specific example apps and Playwright-driven integration fixtures used to exercise the plugin end to end.

Code Quality The repository carries roughly 65 unit test files under src/**/__tests__ run with Vitest, plus a separate integration/ Vitest suite and a Playwright e2e suite that boots real host/remote fixtures across many frameworks. Formatting is enforced via oxfmt --check and a Husky pre-commit hook, with a dedicated typecheck script kept independent of the build step. Error paths use a dedicated createModuleFederationError/mfWarn logger rather than silent failures.

What Makes It Unique Beyond feature parity with the original webpack Module Federation plugin, it adds Vite/Rolldown-specific optimizations not found in comparable plugins: export-level shared-dependency tree shaking with a server-calc mode designed for deployment pipelines that merge usage metadata across consumers, build-time stripping of entire unused runtime capabilities (remote/shared/snapshot support), and an external-runtime mode letting many remotes share one runtime-core instance. It also actively tracks Vite 8’s new Rolldown-based codeSplitting.groups API, layering its own federation chunk groups above user-defined ones rather than overriding them outright.