From 3ae3b5e46d69046b8cb55d70b67bf2cd6cfb44f0 Mon Sep 17 00:00:00 2001 From: typesafeui Date: Wed, 2 Jul 2025 01:45:08 +0200 Subject: [PATCH] Fix turbo example --- examples/turbo-rspack-mf/README.md | 9 +++++---- .../apps/home/module-federation.config.ts | 2 +- examples/turbo-rspack-mf/apps/home/package.json | 1 + examples/turbo-rspack-mf/apps/home/rspack.config.ts | 4 ++-- examples/turbo-rspack-mf/apps/home/src/RemoteEntry.tsx | 2 +- .../apps/host/module-federation.config.ts | 2 +- examples/turbo-rspack-mf/apps/host/package.json | 1 + examples/turbo-rspack-mf/apps/host/rspack.config.ts | 4 ++-- examples/turbo-rspack-mf/apps/host/src/App.tsx | 2 +- .../turbo-rspack-mf/apps/host/src/components/Header.tsx | 2 +- examples/turbo-rspack-mf/apps/host/turbo.json | 4 ++-- .../apps/settings/module-federation.config.ts | 2 +- examples/turbo-rspack-mf/apps/settings/package.json | 1 + examples/turbo-rspack-mf/apps/settings/rspack.config.ts | 4 ++-- examples/turbo-rspack-mf/turbo.json | 2 +- 15 files changed, 23 insertions(+), 19 deletions(-) diff --git a/examples/turbo-rspack-mf/README.md b/examples/turbo-rspack-mf/README.md index 90e3d8bf..07ca6707 100644 --- a/examples/turbo-rspack-mf/README.md +++ b/examples/turbo-rspack-mf/README.md @@ -32,8 +32,9 @@ npx create-turbo@latest --example https://github.com/swalker326/ze-starter-turbo ```bash pnpm install ``` - -2. **Development mode** +2. **Zephyr Setup** + Update all the occurences of `zephyr:turbo_host@*` to be `zephyr:turbo_host.[your_project_name].[your_organiztion]@*` where your `your_project_name` and `your_organization` are from zephyr cloud +3. **Development mode** ```bash pnpm dev ``` @@ -43,7 +44,7 @@ npx create-turbo@latest --example https://github.com/swalker326/ze-starter-turbo - **Home**: http://localhost:3001 (remote micro-frontend) - **Settings**: http://localhost:3002 (remote micro-frontend) -3. **Build for production** +4. **Build for production** ```bash pnpm build ``` @@ -53,7 +54,7 @@ npx create-turbo@latest --example https://github.com/swalker326/ze-starter-turbo turbo build ``` -4. **Other commands** +5. **Other commands** ```bash pnpm lint # Lint all packages pnpm check # Run Biome checks diff --git a/examples/turbo-rspack-mf/apps/home/module-federation.config.ts b/examples/turbo-rspack-mf/apps/home/module-federation.config.ts index eed2fa29..d7d37239 100644 --- a/examples/turbo-rspack-mf/apps/home/module-federation.config.ts +++ b/examples/turbo-rspack-mf/apps/home/module-federation.config.ts @@ -9,5 +9,5 @@ export const mfConfig: ModuleFederationPluginOptions = { remotes: { turbo_host: "turbo_host@http://localhost:3000/remoteEntry.js" }, - shared: ["react", "react-dom", "react-router"] + shared: ["react", "react-dom", "react-router", "react-router-dom"] }; diff --git a/examples/turbo-rspack-mf/apps/home/package.json b/examples/turbo-rspack-mf/apps/home/package.json index a76e3ef1..47a538e5 100644 --- a/examples/turbo-rspack-mf/apps/home/package.json +++ b/examples/turbo-rspack-mf/apps/home/package.json @@ -18,6 +18,7 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "react-router": "^6.30.0", + "react-router-dom": "^6.30.0", "tailwindcss": "catalog:tailwind3", "zephyr-rspack-plugin": "catalog:zephyr" }, diff --git a/examples/turbo-rspack-mf/apps/home/rspack.config.ts b/examples/turbo-rspack-mf/apps/home/rspack.config.ts index d864792c..0e0fafd9 100644 --- a/examples/turbo-rspack-mf/apps/home/rspack.config.ts +++ b/examples/turbo-rspack-mf/apps/home/rspack.config.ts @@ -1,5 +1,5 @@ import { rspack } from "@rspack/core"; -import * as RefreshPlugin from "@rspack/plugin-react-refresh"; +import { ReactRefreshRspackPlugin } from "@rspack/plugin-react-refresh"; import { withZephyr } from "zephyr-rspack-plugin"; import { mfConfig } from "./module-federation.config"; @@ -61,7 +61,7 @@ export default withZephyr()({ new rspack.HtmlRspackPlugin({ template: "./index.html" }), - isDev ? new RefreshPlugin() : null, + isDev ? new ReactRefreshRspackPlugin() : null, new rspack.container.ModuleFederationPlugin(mfConfig) ].filter(Boolean), optimization: { diff --git a/examples/turbo-rspack-mf/apps/home/src/RemoteEntry.tsx b/examples/turbo-rspack-mf/apps/home/src/RemoteEntry.tsx index ddf00457..cccf0af2 100644 --- a/examples/turbo-rspack-mf/apps/home/src/RemoteEntry.tsx +++ b/examples/turbo-rspack-mf/apps/home/src/RemoteEntry.tsx @@ -1,5 +1,5 @@ import { Cloud, Book, Link2Icon } from 'lucide-react'; -import { Link } from 'react-router'; +import { Link } from 'react-router-dom'; function RemoteEntry() { return ( diff --git a/examples/turbo-rspack-mf/apps/host/module-federation.config.ts b/examples/turbo-rspack-mf/apps/host/module-federation.config.ts index 4e0b9c28..780abf14 100644 --- a/examples/turbo-rspack-mf/apps/host/module-federation.config.ts +++ b/examples/turbo-rspack-mf/apps/host/module-federation.config.ts @@ -10,5 +10,5 @@ export const mfConfig: ModuleFederationPluginOptions = { exposes: { "./RemoteEntry": "./src/App.tsx" }, - shared: ["react", "react-dom", "react-router"] + shared: ["react", "react-dom", "react-router", "react-router-dom"] }; diff --git a/examples/turbo-rspack-mf/apps/host/package.json b/examples/turbo-rspack-mf/apps/host/package.json index 3555716b..d006e274 100644 --- a/examples/turbo-rspack-mf/apps/host/package.json +++ b/examples/turbo-rspack-mf/apps/host/package.json @@ -19,6 +19,7 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "react-router": "^6.30.0", + "react-router-dom": "^6.30.0", "tailwindcss": "catalog:tailwind3", "zephyr-rspack-plugin": "catalog:zephyr" }, diff --git a/examples/turbo-rspack-mf/apps/host/rspack.config.ts b/examples/turbo-rspack-mf/apps/host/rspack.config.ts index 293c6c60..83043cc3 100644 --- a/examples/turbo-rspack-mf/apps/host/rspack.config.ts +++ b/examples/turbo-rspack-mf/apps/host/rspack.config.ts @@ -1,5 +1,5 @@ import { rspack } from "@rspack/core"; -import * as RefreshPlugin from "@rspack/plugin-react-refresh"; +import { ReactRefreshRspackPlugin } from "@rspack/plugin-react-refresh"; import { withZephyr } from "zephyr-rspack-plugin"; import { mfConfig } from "./module-federation.config"; @@ -61,7 +61,7 @@ export default withZephyr()({ new rspack.HtmlRspackPlugin({ template: "./index.html" }), - isDev ? new RefreshPlugin() : null, + isDev ? new ReactRefreshRspackPlugin() : null, new rspack.container.ModuleFederationPlugin(mfConfig) ].filter(Boolean), optimization: { diff --git a/examples/turbo-rspack-mf/apps/host/src/App.tsx b/examples/turbo-rspack-mf/apps/host/src/App.tsx index c25bafe3..9ec0e03c 100644 --- a/examples/turbo-rspack-mf/apps/host/src/App.tsx +++ b/examples/turbo-rspack-mf/apps/host/src/App.tsx @@ -1,6 +1,6 @@ import Settings from 'turbo_settings/RemoteEntry'; import Home from 'turbo_home/RemoteEntry'; -import { BrowserRouter, Route, Routes } from 'react-router'; +import { BrowserRouter, Route, Routes } from 'react-router-dom'; import AppLayout from './components/AppLayout'; import { useLocalStorage } from './useLocalStorage'; diff --git a/examples/turbo-rspack-mf/apps/host/src/components/Header.tsx b/examples/turbo-rspack-mf/apps/host/src/components/Header.tsx index d8392701..ee59d938 100644 --- a/examples/turbo-rspack-mf/apps/host/src/components/Header.tsx +++ b/examples/turbo-rspack-mf/apps/host/src/components/Header.tsx @@ -1,6 +1,6 @@ import { Cloud, Github, Menu, X } from 'lucide-react'; import React from 'react'; -import { Link } from 'react-router'; +import { Link } from 'react-router-dom'; import { useLocalStorage } from '../useLocalStorage'; export function Header() { diff --git a/examples/turbo-rspack-mf/apps/host/turbo.json b/examples/turbo-rspack-mf/apps/host/turbo.json index d0a413a4..4394d2f3 100644 --- a/examples/turbo-rspack-mf/apps/host/turbo.json +++ b/examples/turbo-rspack-mf/apps/host/turbo.json @@ -3,9 +3,9 @@ "extends": ["//"], "tasks": { "build": { - "dependsOn": ["settings#build", "home#build"], + "dependsOn": ["turbo_settings#build", "turbo_home#build"], "inputs": ["$TURBO_DEFAULT$", ".env*"], - "outputs": [".next/**", "!.next/cache/**"] + "outputs": [".next/**", "!.next/cache/**", "dist/**"] } } } diff --git a/examples/turbo-rspack-mf/apps/settings/module-federation.config.ts b/examples/turbo-rspack-mf/apps/settings/module-federation.config.ts index 1e56c5dc..59a1aa03 100644 --- a/examples/turbo-rspack-mf/apps/settings/module-federation.config.ts +++ b/examples/turbo-rspack-mf/apps/settings/module-federation.config.ts @@ -9,5 +9,5 @@ export const mfConfig: ModuleFederationPluginOptions = { remotes: { turbo_host: "turbo_host@http://localhost:3000/remoteEntry.js" }, - shared: ["react", "react-dom", "react-router"] + shared: ["react", "react-dom", "react-router", "react-router-dom"] }; diff --git a/examples/turbo-rspack-mf/apps/settings/package.json b/examples/turbo-rspack-mf/apps/settings/package.json index c5203794..bf59795b 100644 --- a/examples/turbo-rspack-mf/apps/settings/package.json +++ b/examples/turbo-rspack-mf/apps/settings/package.json @@ -18,6 +18,7 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "react-router": "^6.30.0", + "react-router-dom": "^6.30.0", "tailwindcss": "catalog:tailwind3", "zephyr-rspack-plugin": "catalog:zephyr" }, diff --git a/examples/turbo-rspack-mf/apps/settings/rspack.config.ts b/examples/turbo-rspack-mf/apps/settings/rspack.config.ts index 16fcfb75..f2f5e603 100644 --- a/examples/turbo-rspack-mf/apps/settings/rspack.config.ts +++ b/examples/turbo-rspack-mf/apps/settings/rspack.config.ts @@ -1,6 +1,6 @@ import { defineConfig } from "@rspack/cli"; import { rspack } from "@rspack/core"; -import * as RefreshPlugin from "@rspack/plugin-react-refresh"; +import { ReactRefreshRspackPlugin } from "@rspack/plugin-react-refresh"; import { withZephyr } from "zephyr-rspack-plugin"; import { mfConfig } from "./module-federation.config"; @@ -61,7 +61,7 @@ export default withZephyr()({ new rspack.HtmlRspackPlugin({ template: "./index.html" }), - isDev ? new RefreshPlugin() : null, + isDev ? new ReactRefreshRspackPlugin() : null, new rspack.container.ModuleFederationPlugin(mfConfig) ].filter(Boolean), optimization: { diff --git a/examples/turbo-rspack-mf/turbo.json b/examples/turbo-rspack-mf/turbo.json index 4648a9e1..d7162904 100644 --- a/examples/turbo-rspack-mf/turbo.json +++ b/examples/turbo-rspack-mf/turbo.json @@ -5,7 +5,7 @@ "build": { "dependsOn": ["^build"], "inputs": ["$TURBO_DEFAULT$", ".env*"], - "outputs": [".next/**", "!.next/cache/**"], + "outputs": [".next/**", "!.next/cache/**", "dist/**"], "env": ["ZE_API", "ZE_API_GATE", "DEBUG"] }, "lint": {