Migration Guide

Migrating from Existing MFE Setup

From Manual Vite + Module Federation

Initialize MFE Forge in your project root:
bash
```
npx mfe-forge init --skip-install
```

Move existing apps to apps/ directory:

apps/
├── your-scope/
│   ├── host/       # Your existing shell app
│   ├── app1/       # Your existing MFEs
│   └── app2/

Update vite.config.ts files:

// Add shared dependencies via MFE Forge conventions
shared: {
  react: { singleton: true, requiredVersion: '^19.1.0' },
  'react-dom': { singleton: true, requiredVersion: '^19.1.0' },
}

Run sync:
bash
```
npx mfe-forge sync
```

From Webpack Module Federation

Convert webpack configs to Vite: MFE Forge uses Vite with @originjs/vite-plugin-federation.
Update entry points:
- Webpack: bootstrap.js
- Vite: bootstrap.tsx

Replace HtmlWebpackPlugin with index.html:

html

<!DOCTYPE html>
<html>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>

From Single SPA

Remove single-spa adapters: MFE Forge uses native Module Federation instead of single-spa.

Update root component exports:

tsx

// Export for Module Federation
export default function App() { ... }

Register in host:

tsx

const RemoteApp = React.lazy(() => import('remoteApp/App'))

Gradual Migration Strategy

For large codebases, migrate incrementally:

Start with new MFEs using MFE Forge
Wrap legacy apps in iframe within new host
Migrate one MFE at a time to native Module Federation
Use event bus for communication between old and new MFEs

Configuration Migration

Move your existing config to mfeforge.config.ts:

export default {
  name: 'my-project',
  defaults: {
    framework: 'react',
    styling: 'tailwind',
    packageManager: 'pnpm',
  },
  federation: {
    shared: ['react', 'react-dom', 'react-router-dom', 'zustand'],
  },
}

Migration Guide ​

Migrating from Existing MFE Setup ​

From Manual Vite + Module Federation ​

From Webpack Module Federation ​

From Single SPA ​

Gradual Migration Strategy ​

Configuration Migration ​