{
  "id": 12821754,
  "title": "Module Federation with Vite in production: what changes",
  "url": "https://urgent.news/2026/10/08/module-federation-with-vite-in-production-what-changes",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-10-08T08:10:00.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/mfeorchestrator/module-federation-with-vite-in-production-what-changes-57k"
  },
  "original_language": "en",
  "account": "Module Federation, a feature of Webpack, has now been adapted for use with Vite. This allows Vite's development server and build process to work together seamlessly. Despite this integration, there are key differences between Vite's development environment and its production build that can cause issues in a production setting.\n\nOne major difference lies in dependency deduplication. During development, modules can be duplicated without consequence. However, in production, Vite bundles dependencies, which can lead to conflicts if shared libraries are loaded more than once.\n\nAnother issue is the module initialization order. The on-demand transformation feature of the Vite development server may hide import cycles that would be fatal in a bundled production build. To avoid these problems, it's important to share dependencies deliberately and sparingly. Singleton components, such as the framework runtime or the router, should be marked as shared, while other dependencies are usually better off duplicated.\n\nA common mistake to avoid is using version ranges for shared dependencies across multiple micro frontends. This can result in a singleton being determined by the first version to load, rather than the intended version.\n\nThe remote URLs used to connect different parts of Module Federation are typically defined in the bundler configuration. While this method is straightforward, it can become cumbersome when updates occur, requiring edits to the host repository and a subsequent rebuild.\n\nTo avoid potential issues in production, it's recommended to build each remote and load them from a host rather than using the Vite development server. This approach allows for testing each remote individually and ensures all configurations are correct before deployment. Furthermore, it's crucial to inspect the output for duplicated framework copies and ensure remote URLs are resolved at runtime.",
  "summary": "Module Federation started in Webpack, and for years that is where it stayed. It works on Vite now, through @module-federation/vite , and works well — but Vite's dev server and Vite's build are two different machines, and Module Federation has to satisfy both. Most production surprises live in that gap. Does Module Federation actually work with Vite? Yes. The plugin exposes the same concepts you…",
  "key_points": [
    "Module Federation integrated with Vite's development server and build process",
    "Dependency deduplication differs between development and production builds",
    "Shared dependencies should be marked deliberately to avoid conflicts"
  ],
  "editors_take": null,
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}