This specification is maintained by the AgentRules Working Group. Have enhancements or want to claim maintainership?Submit Specification →
frontendcritical PriorityID: vite-6-module-federation-runtime-singleton-deduplication

Vite 6 Module Federation Runtime Singleton Deduplication Invariant

Enforces strict runtime singleton deduplication and asynchronous boundary bootstrapping in Vite 6 micro-frontend architectures. Prevents dual-instance framework execution, broken context providers, and split reactive runtimes when integrating independently deployed remotes and hosts.

Prohibited Anti-Pattern: Dual-Instance Framework Execution and Split Contexts Caused by Unbound Vite MF Singletons

Export Ready-to-Drop Configuration

Select format below to copy code or download file directly.

---
description: Vite 6 Module Federation Runtime Singleton Deduplication Invariant - Enforces strict runtime singleton deduplication and asynchronous boundary bootstrapping in Vite 6 micro-frontend architectures. Prevents dual-instance framework execution, broken context providers, and split reactive runtimes when integrating independently deployed remotes and hosts.
globs: vite.config.ts, vite.config.mts, src/index.ts, src/bootstrap.tsx, src/bootstrap.ts
alwaysApply: true
verified_by: "agentrules.org"
license: "CC-BY-4.0"
source: "https://agentrules.org/rules/vite-6-module-federation-runtime-singleton-deduplication"
---

# Vite 6 Module Federation Runtime Singleton Deduplication Invariant

> **Severity**: CRITICAL | **Category**: frontend
> **Anti-Pattern Warning**: Dual-Instance Framework Execution and Split Contexts Caused by Unbound Vite MF Singletons

## System Constraints
You are a Principal Software Architect enforcing runtime singleton integrity in Vite 6 Module Federation architectures. You must mandate strict version declarations, singleton flags for reactive cores (React, Vue, Pinia, TanStack Query), explicit asynchronous boundaries (bootstrap pattern), and unified runtime instances across all micro-frontend boundaries to prevent split context trees and invalid hook dispatchers.

## Strict Guidelines
- Engineers MUST ALWAYS isolate the application entry point into an asynchronous boundary (`import('./bootstrap')`) inside `src/index.ts` to allow Vite and the Module Federation runtime to negotiate shared singletons before executing application code.
- Engineers MUST configure critical framework dependencies (e.g., `react`, `react-dom`, `@module-federation/runtime`) as `singleton: true` and `strictVersion: true` with an explicit `requiredVersion` derived from `package.json`.
- Engineers MUST NOT synchronously render UI frameworks or initialize reactive stores in the root entry file preceding the federated container initialization.
- Code SHOULD leverage `@module-federation/vite` (Module Federation 2.0) with unified runtime settings rather than unmaintained legacy Vite federation wrappers.
- Services MUST declare identical `shareScope` identifiers (defaulting to `'default'`) between host shells and remote containers for shared global singletons.
- Components NEVER consume cross-micro-frontend context providers directly without asserting that the provider package is registered as a strict singleton in both the host and remote module federation manifests.

## Bad vs Good Implementations
### Vite 6 Module Federation Singleton Configuration & Bootstrap Boundary

#### Bad Antipattern (AI Common Hallucination)
> **Why it fails**: Declaring shared dependencies as simple strings without singleton and strictVersion metadata fails to guarantee a single runtime instance. Synchronously bootstrapping the application in the entry point executes React before the Module Federation runtime resolves shared dependencies across remote boundaries.
```typescript
// vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { federation } from '@module-federation/vite';

export default defineConfig({
  plugins: [
    react(),
    federation({
      name: 'remote_app',
      filename: 'remoteEntry.js',
      // CRITICAL FLAW: Omitting singleton and strictVersion causes dual React instances,
      // leading to "Invalid Hook Call" exceptions and split React contexts.
      shared: ['react', 'react-dom']
    })
  ]
});

// src/index.tsx
// CRITICAL FLAW: Synchronous top-level mounting executes before remote runtime
// negotiates shared scope, forcing the local bundle to execute its private copy.
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')!).render(<App />);
```

#### Production Standard (Correct)
> **Standard**: Configuring dependencies with singleton: true and strictVersion: true guarantees that only one instance of the framework runtime is initialized in memory. Moving the execution into an asynchronous bootstrap file ensures the runtime finishes dependency negotiation before components or hooks execute.
```typescript
// vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { federation } from '@module-federation/vite';
import pkg from './package.json' with { type: 'json' };

export default defineConfig({
  plugins: [
    react(),
    federation({
      name: 'remote_app',
      filename: 'remoteEntry.js',
      exposes: {
        './Widget': './src/Widget.tsx'
      },
      shared: {
        react: {
          singleton: true,
          strictVersion: true,
          requiredVersion: pkg.dependencies['react']
        },
        'react-dom': {
          singleton: true,
          strictVersion: true,
          requiredVersion: pkg.dependencies['react-dom']
        }
      }
    })
  ],
  build: {
    target: 'chrome89'
  }
});

// src/index.ts (Asynchronous Bootstrap Boundary)
import('./bootstrap').catch((err) => {
  console.error('Fatal initialization error in federated bootstrap:', err);
});

// src/bootstrap.tsx
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';

const rootElement = document.getElementById('root');
if (rootElement) {
  ReactDOM.createRoot(rootElement).render(<App />);
}
```

Architectural Specification & Invariant Rationale

Architectural Invariant Design: Vite 6 Module Federation Runtime Singleton Deduplication Invariant

Vite 6 Module Federation Runtime Singleton Deduplication Invariant defines an industrial-grade behavioral standard for frontend engineering. Enforces strict runtime singleton deduplication and asynchronous boundary bootstrapping in Vite 6 micro-frontend architectures. Prevents dual-instance framework execution, broken context providers, and split reactive runtimes when integrating independently deployed remotes and hosts. Modern software architectures require strict adherence to deterministic patterns to guarantee high availability, maintainability, and zero security vulnerabilities.

Framework Paradigm Shift & Drift MechanicsLLMs are trained on millions of open-source repositories containing outdated code, legacy idioms, and unpatched antipatterns. When coding assistants generate implementations for this stack, they default to common statistical tokens: Dual-Instance Framework Execution and Split Contexts Caused by Unbound Vite MF Singletons Without an explicit system instruction file, developers spend hours debugging silent failures.
Failure Modes & Production Blast Radius

Hazard Analysis: What Breaks Without This Rule

The following failure modes have been cataloged from hundreds of hours of production code reviews where AI assistants produced non-compliant implementations:

Failure ModeAI Symptom (The Anti-Pattern)SeverityProduction Impact & Remedy
AI Hallucination & Deprecation DriftDual-Instance Framework Execution and Split Contexts Caused by Unbound Vite MF SingletonsCritical
Violating this industrial standard introduces regression bugs, security risks, and unexpected runtime failures in production.
Enforce explicit behavioral system directives across all AI coding assistants in your repository.
Silent Architecture InconsistencyAI assistants produce mixed paradigms across files, creating fragmented codebase conventions.Medium
Increases cognitive load during code reviews and leads to maintenance debt across engineering teams.
Pin project conventions in .cursor/rules, CLAUDE.md, and AGENTS.md so all team agents follow identical guardrails.
Architectural Directives in Detail

Step-by-Step Production Directives

Each rule constraint below is injected into the AI agent's system prompt to establish deterministic boundaries:

1

Engineers MUST ALWAYS isolate the application entry point into an asynchronous boundary (`import('./bootstrap')`) inside `src/index.ts` to allow Vite and the Module Federation runtime to negotiate shared singletons before executing application code.

Engineers MUST ALWAYS isolate the application entry point into an asynchronous boundary (`import('./bootstrap')`) inside `src/index.ts` to allow Vite and the Module Federation runtime to negotiate shared singletons before executing application code.

Rationale:AI models frequently generate unconstrained code here because statistical language distributions lack project-specific architectural context. Mandating this directive ensures that generated code adheres to verified industrial production requirements.
Enforcement:Integrated into the Agent Pack rule file. When Cursor, Claude Code, or Codex processes this prompt, it applies this constraint before emitting syntax.
2

Engineers MUST configure critical framework dependencies (e.g., `react`, `react-dom`, `@module-federation/runtime`) as `singleton

Engineers MUST configure critical framework dependencies (e.g., `react`, `react-dom`, `@module-federation/runtime`) as `singleton: true` and `strictVersion: true` with an explicit `requiredVersion` derived from `package.json`.

Rationale:AI models frequently generate unconstrained code here because statistical language distributions lack project-specific architectural context. Mandating this directive ensures that generated code adheres to verified industrial production requirements.
Enforcement:Integrated into the Agent Pack rule file. When Cursor, Claude Code, or Codex processes this prompt, it applies this constraint before emitting syntax.
3

Engineers MUST NOT synchronously render UI frameworks or initialize reactive stores in the root entry file preceding the federated container initialization.

Engineers MUST NOT synchronously render UI frameworks or initialize reactive stores in the root entry file preceding the federated container initialization.

Rationale:AI models frequently generate unconstrained code here because statistical language distributions lack project-specific architectural context. Mandating this directive ensures that generated code adheres to verified industrial production requirements.
Enforcement:Integrated into the Agent Pack rule file. When Cursor, Claude Code, or Codex processes this prompt, it applies this constraint before emitting syntax.
4

Code SHOULD leverage `@module-federation/vite` (Module Federation 2.0) with unified runtime settings rather than unmaintained legacy Vite federation wrappers.

Code SHOULD leverage `@module-federation/vite` (Module Federation 2.0) with unified runtime settings rather than unmaintained legacy Vite federation wrappers.

Rationale:AI models frequently generate unconstrained code here because statistical language distributions lack project-specific architectural context. Mandating this directive ensures that generated code adheres to verified industrial production requirements.
Enforcement:Integrated into the Agent Pack rule file. When Cursor, Claude Code, or Codex processes this prompt, it applies this constraint before emitting syntax.
5

Services MUST declare identical `shareScope` identifiers (defaulting to `'default'`) between host shells and remote containers for shared global singletons.

Services MUST declare identical `shareScope` identifiers (defaulting to `'default'`) between host shells and remote containers for shared global singletons.

Rationale:AI models frequently generate unconstrained code here because statistical language distributions lack project-specific architectural context. Mandating this directive ensures that generated code adheres to verified industrial production requirements.
Enforcement:Integrated into the Agent Pack rule file. When Cursor, Claude Code, or Codex processes this prompt, it applies this constraint before emitting syntax.
6

Components NEVER consume cross-micro-frontend context providers directly without asserting that the provider package is registered as a strict singleton in both the host and remote module federation manifests.

Components NEVER consume cross-micro-frontend context providers directly without asserting that the provider package is registered as a strict singleton in both the host and remote module federation manifests.

Rationale:AI models frequently generate unconstrained code here because statistical language distributions lack project-specific architectural context. Mandating this directive ensures that generated code adheres to verified industrial production requirements.
Enforcement:Integrated into the Agent Pack rule file. When Cursor, Claude Code, or Codex processes this prompt, it applies this constraint before emitting syntax.
Technical Questions & Answers

Frequently Asked Technical Questions

Common questions developers face when configuring AI coding assistants for this stack:

Q:Why is Vite 6 Module Federation Runtime Singleton Deduplication Invariant critical for AI coding assistants?

Enforces strict runtime singleton deduplication and asynchronous boundary bootstrapping in Vite 6 micro-frontend architectures. Prevents dual-instance framework execution, broken context providers, and split reactive runtimes when integrating independently deployed remotes and hosts. Without explicit behavioral boundaries, AI coding assistants (Cursor, Claude Code, Windsurf, Codex) rely on training data averages, which frequently produce deprecated, inefficient, or vulnerable code patterns.

Q:How does adopting this rule prevent AI hallucinations?

This rule explicitly declares what the AI must avoid (Dual-Instance Framework Execution and Split Contexts Caused by Unbound Vite MF Singletons) and prescribes verified positive examples. Grounding the LLM with negative and positive pairs eliminates guesswork.

Q:Which AI coding environments are supported?

This specification is multi-platform compatible: Cursor (.cursor/rules/*.mdc & .cursorrules), Anthropic Claude Code (CLAUDE.md), Windsurf (.windsurfrules), Codex / Cline (AGENTS.md), and GitHub Copilot (.github/copilot-instructions.md).

Q:Can I combine this rule with other technology stacks?

Yes. Use the Interactive Stack Builder or download an Agent Pack to merge this rule with other frontend, backend, database, security, and DevOps rules without syntax collision.

Open Specification · CC BY 4.0·Free for Personal, Team & Commercial In-Repo Use

Citation & Open Source Attribution Guidelines

This specification is licensed under Creative Commons Attribution 4.0 International (CC BY 4.0). You are completely free to adapt and share this rule in your workspace. If citing, including in public AI benchmark datasets, or redistributing, attribution to AgentRules.org is required.

Related FRONTEND Rules

View all rules →
frontend
119

SolidStart 1.0 Server Functions & Async Boundaries Production Standard

SolidStart 1.0 relies on the Vinxi bundler to split `server$` closures into independent HTTP POST RPC endpoints. Direct lexical closure over client signals within `server$` scopes or failure to demarcate async boundaries with `<Suspense>` causes silent serialization failures, client-bundle secret leaks, and SSR hydration mismatches. Enforcing strict parameter passing, runtime input validation, and Solid async primitives maintains security and fine-grained reactivity across network boundaries.

frontend
119

Astro 5 Actions & Content Layer Production Standard

Enforces strict type safety and architectural correctness for Astro 5 Server Actions and the zero-waterfall Content Layer API. Prevents runtime contract mismatches, hydration mismatches, and unhandled mutation exceptions across dynamic and prerendered boundaries. Failure to follow these patterns leads to silent data fetching waterfalls, build-time cache corruptions, and unhandled server action exceptions.

frontend
51

Nuxt 4 Nitro Server Engine & Shared Directory Production Standard

Nuxt 4 enforces strict boundary segregation between client UI in the app/ directory, backend endpoints in server/, and universal contracts in shared/. Violating cross-boundary isolation or maintaining module-scoped state in Nitro server handlers causes catastrophic cross-request data corruption and hydration mismatches under concurrent production traffic. Architects must enforce request-isolated H3 event contexts, universal serialization schemas, and strict path-alias boundaries.

1 Rule in Stack

Vite