@fulgurjs/federation 6.8.7 → 6.9.0

package/examples/templates/showcase/README.md

@@ -1,5 +1,8 @@
 # 双向桥接 URL 同步（examples/templates/showcase）
 
+> 本目录是 6.9.0 源码候选：已改用 defineApplication，尚未测试和发布。源码依赖已锁定 6.9.0；正式发布前不要拿旧 registry 包运行这份代码。验收先使用本次候选 tarball，发布后再按下列冻结安装命令验证正式包。
+
+
 `@fulgurjs/federation` 桥接 URL 同步的双向旗舰演示（API 见[文档中心](https://github.com/chenmingye/fulgurjs-federation/blob/master/docs/README.md)）：
 两个方向的宿主 × 子应用各一套——
 
@@ -82,12 +85,12 @@ curl --noproxy '*' -s -o /dev/null -w '%{http_code}\n' http://localhost:5335/@fu
 | 插件公开 API | 入口 | 本演示接线位置 |
 |---|---|---|
 | `createVueBridgeApp(spec, options)` | `@fulgurjs/federation/vue` | `vue-host/src/pages/BridgeReactPage.vue`（`<RemoteReactBridge :routing="routing" :app-props="appProps" />`） |
-| `createVueBridgeNavigation(router)` | `@fulgurjs/federation/vue` | `vue-host/src/routing.ts`（模块级单例端口，main.ts 组装后 `initBridgeRouting(router)`） |
-| `connectVueBridgeRouter(routing, router, { signal })` → `await conn.ready` 后 `app.use(router)` | `@fulgurjs/federation/vue` | `vue-remote/src/bridge.ts`（异步工厂：初始 push 落定后再 install，顺序不能反） |
+| `createVueBridgeNavigation(router)` | `@fulgurjs/federation/vue` | `vue-host/src/routing.ts`（宿主导航端口，application.ts 组装后 `initBridgeRouting(router)`） |
+| `defineApplication(factory, { routing: true })` → 返回 `{ app, router }` | `@fulgurjs/federation/vue` | `vue-remote/src/application.ts`（根据 mode 选择 web/memory history；插件等待初始路由并安装） |
 | `createReactBridgeApp(spec, options)` | `@fulgurjs/federation/react` | `react-host/src/pages/BridgeVuePage.tsx`（`<RemoteVueBridge routing={routing} appProps={appProps} />`） |
 | `createReactBridgeNavigation(router, { canNavigate?, basename? })`（仅 data router） | `@fulgurjs/federation/react` | `react-host/src/routing.ts`（`createBrowserRouter` 实例组装后初始化） |
-| `createReactBridgeRouter(routing, routes, { signal })` → `{ element }` 直接作为工厂返回值 | `@fulgurjs/federation/react` | `react-remote/src/bridge.tsx`（`/` 经 loader `redirect('/orders')` 以 replace 规范化） |
-| `defineBridgeApp(factory, { routing: true })`（协议声明，缺失即 MFU-031） | `@fulgurjs/federation/vue`（Vue）/ `@fulgurjs/federation/react`（React） | `vue-remote/src/bridge.ts`、`react-remote/src/bridge.tsx`（工厂内校验 `ctx?.routing`，`ctx.signal` 传入接线自动 dispose） |
+| `createReactBridgeRouter(routing, routes, { signal })` → `{ element, dispose }` 作为工厂返回值 | `@fulgurjs/federation/react` | `react-remote/src/application.tsx`（`/` 经 loader `redirect('/orders')` 以 replace 规范化） |
+| `defineApplication(factory, { routing: true })`（协议声明，缺失即 MFU-031） | `@fulgurjs/federation/vue`（Vue）/ `@fulgurjs/federation/react`（React） | `vue-remote/src/application.ts`、`react-remote/src/application.tsx`（实例 mode/signal；独立与桥接复用同一套路由） |
 | `BridgeHostRouting`（`{ basePath, navigation }` 组件 prop，独立控制通道不进 appProps） | 类型面见 [API 参考](https://github.com/chenmingye/fulgurjs-federation/blob/master/docs/zh/reference/api.md) | `vue-host/src/routing.ts`、`react-host/src/routing.ts`（basePath 常量 `BRIDGE_BASE_PATH`） |
 | `BridgeChildRoute` / `BridgeLocation`（通道与位置契约） | `@fulgurjs/federation/vue`、`@fulgurjs/federation/react` | 由插件随 mount 第三参数注入子应用；两端仓库源码 `packages/plugin/src/bridge-router-core.ts` |
 
@@ -103,7 +106,7 @@ curl --noproxy '*' -s -o /dev/null -w '%{http_code}\n' http://localhost:5335/@fu
 ## 构建 / 类型检查
 
 ```bash
-# 4 个工程均独立通过（在各自目录执行）
+# 在各应用目录执行；这是验收命令，不代表本轮已经通过
 pnpm run types       # 远程类型同步/验证（宿主同步远程声明；提供方验证生成）
 pnpm run typecheck   # React 工程 tsc --noEmit；Vue 工程 vue-tsc --noEmit
 pnpm run build
@@ -117,7 +120,7 @@ pnpm run build
 2. 宿主 `fulgurjs.config.ts` 里 `remotes` 的 dev 地址（`vue-host` 指向 react-remote 的 5333；`react-host` 指向 vue-remote 的 5335）；
 3. 根 `scripts/dev.config.json` 里该应用的 `port`（**必改**：启动器预检/探活都读它）。
 
-生产部署形态（重要）：两个宿主的路由都没有配置 base，**不能部署到同一站点的根**（两份 `index.html` 会互相覆盖）。按两个站点部署——
+生产部署形态（重要）：两个宿主的默认构建 base 都是根，**不能部署到同一站点的根**（两份 `index.html` 会互相覆盖）。按两个站点部署——
 
 - 站点 A：`vue-host/dist` 部署在根，`react-remote/dist` 部署在同站 `/react-remote/` 子路径（vue-host 的 prod 地址）；
 - 站点 B：`react-host/dist` 部署在另一个站点的根，`vue-remote/dist` 部署在该站 `/vue-remote/` 子路径（react-host 的 prod 地址）；
@@ -127,4 +130,29 @@ pnpm run build
 
 ## 查看应用运行模式
 
-子应用显示“当前应用被桥接：true”；Vue 宿主观测台显示“当前宿主被桥接：false”。两者同页并存也不会串模式。Vue 在组件 setup 中调用 `hasBridgeMount(getCurrentInstance()?.appContext.app)`；React 在桥接工厂中查询 `hasBridgeMount(ctx)`，通过 props 传给布局。独立 createApp 实例的查询结果为 false；本模板的子应用独立入口只提供健康检查壳，不展示业务布局。该值描述实例的运行方式，不是当前挂载数量。
+子应用显示“当前应用被桥接：true”；Vue 宿主观测台显示“当前宿主被桥接：false”。两者同页并存也不会串模式。Vue 在组件 setup 中调用 `hasBridgeMount(getCurrentInstance()?.appContext.app)`；React 在桥接工厂中查询 `hasBridgeMount(ctx)`，通过 props 传给布局。独立启动的查询结果为 false；独立子应用也显示同一套工单列表、详情、设置和导航，不使用健康检查壳。该值描述实例的运行方式，不是当前挂载数量。
+
+## 一键运行生产产物
+
+```bash
+pnpm build
+pnpm prod
+```
+
+`prod` 只服务本次 dist，不启动远程开发服务器。它复用 scripts/dev.config.json 的宿主端口，从实际构建入口推导 base，并把远程静态产物挂在同源子路径。无需为本地复现手写 Nginx；部署真实服务器时仍按部署指南配置。多宿主模板分别启动各宿主地址，不把两个宿主的根资源混在一起。先停止 dev，端口占用会失败并停止本次已起服务；不会关闭已有占用进程。Ctrl+C 关闭本次生产服务。
+
+## 插件代码阅读地图
+
+| 文件 | 职责 |
+|---|---|
+| `react-host/src/application.tsx` | 本应用唯一装配；main 只负责调用 start |
+| `react-remote/src/application.tsx` | 本应用唯一装配；main 只负责调用 start |
+| `vue-host/src/application.ts` | 本应用唯一装配；main 只负责调用 start |
+| `vue-remote/src/application.ts` | 本应用唯一装配；main 只负责调用 start |
+| `react-host/fulgurjs.config.ts` | 本应用的远程地址、exposes、实际共享依赖 |
+| `react-remote/fulgurjs.config.ts` | 本应用的远程地址、exposes、实际共享依赖 |
+| `vue-host/fulgurjs.config.ts` | 本应用的远程地址、exposes、实际共享依赖 |
+| `vue-remote/fulgurjs.config.ts` | 本应用的远程地址、exposes、实际共享依赖 |
+| `scripts/dev.mjs` / `scripts/prod.mjs` | 统一开发/生产启动器；业务接入不复制它们到应用源码 |
+
+`application` 是新增的插件装配文件，`main` 是已有入口接线；页面组件、业务路由、权限和数据不是每个项目都必写的联邦配置。跨框架基础组合不逐页登记子应用菜单；逐页远程页面模板的页面表仅服务它所展示的逐页场景。`src/fulgurjs/types/` 是插件生成目录，按远程实际版本同步，不维护人工伪造的声明或旧缓存。

package/examples/templates/showcase/package.json

@@ -8,6 +8,7 @@
     "dev:vue-host": "pnpm --dir vue-host dev",
     "dev:react-host": "pnpm --dir react-host dev",
     "dev": "node scripts/dev.mjs",
-    "build": "pnpm -r build"
+    "build": "pnpm -r build",
+    "prod": "node scripts/prod.mjs"
   }
 }

package/examples/templates/showcase/pnpm-lock.yaml

@@ -11,8 +11,8 @@ importers:
   react-host:
     dependencies:
       '@fulgurjs/federation':
-        specifier: 6.8.5
-        version: 6.8.5(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
+        specifier: 6.9.0
+        version: 6.9.0(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
       react:
         specifier: ^19.1.0
         version: 19.3.0
@@ -45,8 +45,8 @@ importers:
   react-remote:
     dependencies:
       '@fulgurjs/federation':
-        specifier: 6.8.5
-        version: 6.8.5(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
+        specifier: 6.9.0
+        version: 6.9.0(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
       react:
         specifier: ^19.1.0
         version: 19.3.0
@@ -76,8 +76,8 @@ importers:
   vue-host:
     dependencies:
       '@fulgurjs/federation':
-        specifier: 6.8.5
-        version: 6.8.5(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
+        specifier: 6.9.0
+        version: 6.9.0(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
       react:
         specifier: ^19.1.0
         version: 19.3.0
@@ -107,8 +107,8 @@ importers:
   vue-remote:
     dependencies:
       '@fulgurjs/federation':
-        specifier: 6.8.5
-        version: 6.8.5(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
+        specifier: 6.9.0
+        version: 6.9.0(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))
       vue:
         specifier: ^3.5.13
         version: 3.5.43(typescript@5.9.3)
@@ -526,8 +526,8 @@ packages:
     cpu: [x64]
     os: [win32]
 
-  '@fulgurjs/federation@6.8.5':
-    resolution: {integrity: sha512-RsaN4n2ZgGBtI9zVQxDclS3QxYVKAZiCGipXR3umreAg651tIYCmtqkVjqPELSCPW9tg/rYQvzzs/SOV6ZiQfg==}
+  '@fulgurjs/federation@6.9.0':
+    resolution: {tarball: https://registry.npmjs.org/@fulgurjs/federation/-/federation-6.9.0.tgz}
     engines: {node: '>=18'}
     hasBin: true
     peerDependencies:
@@ -1348,7 +1348,7 @@ snapshots:
   '@esbuild/win32-x64@0.27.7':
     optional: true
 
-  '@fulgurjs/federation@6.8.5(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))':
+  '@fulgurjs/federation@6.9.0(react-dom@19.3.0(react@19.3.0))(react-router-dom@7.18.4(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)(vite@6.4.4)(vue-router@4.6.4(vue@3.5.43(typescript@5.9.3)))(vue@3.5.43(typescript@5.9.3))':
     dependencies:
       es-module-lexer: 1.7.0
       esbuild: 0.27.7

package/examples/templates/showcase/pnpm-workspace.yaml

@@ -4,7 +4,7 @@ packages:
   - react-host
   - react-remote
 minimumReleaseAgeExclude:
-  - '@fulgurjs/federation@6.8.5'
+  - '@fulgurjs/federation@6.9.0'
 # pnpm >=12 构建脚本批准（12 起弃用 onlyBuiltDependencies；pnpm 9-11 忽略本键：
 # esbuild >=0.16 二进制经 optionalDependencies 平台包分发，postinstall 仅校验，不阻塞安装）
 allowBuilds:

package/examples/templates/showcase/react-host/package.json

@@ -11,7 +11,7 @@
     "types": "fulgurjs types"
   },
   "dependencies": {
-    "@fulgurjs/federation": "6.8.5",
+    "@fulgurjs/federation": "6.9.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-router-dom": "^7.1.0",

package/examples/templates/showcase/react-host/src/application.tsx

@@ -0,0 +1,28 @@
+import { defineApplication } from '@fulgurjs/federation/react'
+import { createBrowserRouter, RouterProvider } from 'react-router-dom'
+import Layout from './Layout'
+import HomePage from './pages/HomePage'
+import AboutPage from './pages/AboutPage'
+import BridgeVuePage from './pages/BridgeVuePage'
+import { initBridgeRouting } from './routing'
+import { installPopStateLogger } from './demo-log'
+
+export default defineApplication((_props, { signal }) => {
+  const router = createBrowserRouter([
+    {
+      path: '/',
+      element: <Layout />,
+      children: [
+        { index: true, element: <HomePage /> },
+        { path: 'about', element: <AboutPage /> },
+        // catch-all：子应用挂载在 /br-vue 前缀下，内部导航全部命中同一条路由记录
+        { path: 'br-vue/*', element: <BridgeVuePage /> },
+      ],
+    },
+  ], { basename: import.meta.env.BASE_URL })
+
+  initBridgeRouting(router)
+  installPopStateLogger(signal)
+
+  return { element: <RouterProvider router={router} />, dispose: () => router.dispose() }
+})

package/examples/templates/showcase/react-host/src/demo-log.ts

@@ -62,13 +62,10 @@ export function handleChildEvent(event: DemoChildEvent): void {
   log(event.source, `${event.action} ${event.detail}`)
 }
 
-let popInstalled = false
-
-/** 浏览器前进后退（POP）在 main.tsx 安装一次；push/replace 由各自来源显式标注 */
-export function installPopStateLogger(): void {
-  if (popInstalled) return
-  popInstalled = true
+/** POP 观测属于本应用实例；卸载后由 signal 移除，不遗留窗口监听。 */
+export function installPopStateLogger(signal: AbortSignal): void {
+  if (signal.aborted) return
   window.addEventListener('popstate', () => {
-    log('浏览器前进后退', window.location.pathname + window.location.search)
-  })
+    logNav('浏览器前进后退', window.location.pathname + window.location.search)
+  }, { signal })
 }

package/examples/templates/showcase/react-host/src/main.tsx

@@ -1,33 +1,2 @@
-/**
- * examples/templates/showcase/react-host/src/main.tsx — 宿主入口。
- * data router（createBrowserRouter + RouterProvider）是 URL 同步的前提（declarative 模式无取消语义）；
- * catch-all 路由（/br-vue/* 单条记录渲染同一组件）保证子应用内部导航不重挂宿主组件。
- * 注意：刻意不包 StrictMode——桥接契约工厂在每次 mount 时执行，StrictMode 的双 effect
- * 会让子应用挂载计数翻倍，干扰「mount 次数恒为 1」演示（生产语义不受影响）。
- */
-import { createRoot } from 'react-dom/client'
-import { createBrowserRouter, RouterProvider } from 'react-router-dom'
-import Layout from './Layout'
-import HomePage from './pages/HomePage'
-import AboutPage from './pages/AboutPage'
-import BridgeVuePage from './pages/BridgeVuePage'
-import { initBridgeRouting } from './routing'
-import { installPopStateLogger } from './demo-log'
-
-const router = createBrowserRouter([
-  {
-    path: '/',
-    element: <Layout />,
-    children: [
-      { index: true, element: <HomePage /> },
-      { path: 'about', element: <AboutPage /> },
-      // catch-all：子应用挂载在 /br-vue 前缀下，内部导航全部命中同一条路由记录
-      { path: 'br-vue/*', element: <BridgeVuePage /> },
-    ],
-  },
-])
-
-initBridgeRouting(router)
-installPopStateLogger()
-
-createRoot(document.getElementById('root')!).render(<RouterProvider router={router} />)
+import application from './application'
+void application.start('#root').catch(console.error)

package/examples/templates/showcase/react-host/src/routing.ts

@@ -11,10 +11,10 @@ export const BRIDGE_BASE_PATH = '/br-vue'
 let routing: BridgeHostRouting | undefined
 
 export function initBridgeRouting(router: Parameters<typeof createReactBridgeNavigation>[0]): void {
-  routing = { basePath: BRIDGE_BASE_PATH, navigation: createReactBridgeNavigation(router) }
+  routing = { basePath: BRIDGE_BASE_PATH, navigation: createReactBridgeNavigation(router, { basename: import.meta.env.BASE_URL }) }
 }
 
 export function getBridgeRouting(): BridgeHostRouting {
-  if (!routing) throw new Error('桥接路由端口未初始化：请先在 main.tsx 调用 initBridgeRouting(router)')
+  if (!routing) throw new Error('桥接路由端口未初始化：请先在 application.tsx 调用 initBridgeRouting(router)')
   return routing
 }

package/examples/templates/showcase/react-remote/fulgurjs.config.ts

@@ -9,7 +9,7 @@ export default {
   name: 'react-remote',
   filename: 'fulgurjs-remoteEntry.js',
   exposes: {
-    './bridge': './src/bridge.tsx',
+    './bridge': './src/application.tsx',
   },
   shared: {
     react: { singleton: true },

package/examples/templates/showcase/react-remote/package.json

@@ -11,7 +11,7 @@
     "types": "fulgurjs types"
   },
   "dependencies": {
-    "@fulgurjs/federation": "6.8.5",
+    "@fulgurjs/federation": "6.9.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-router-dom": "^7.1.0"

package/examples/templates/showcase/react-remote/src/ChildLayout.tsx

@@ -5,9 +5,10 @@
  */
 import { Outlet, useNavigate } from 'react-router-dom'
 import type { ReactElement } from 'react'
-import { getMountCount, reportNav } from './child-bus'
+import { useChildReporter } from './child-bus'
 
 export default function ChildLayout({ bridged = false }: { bridged?: boolean }): ReactElement {
+  const { getMountCount, reportNav } = useChildReporter()
   const navigate = useNavigate()
 
   const handlePushDemo = (): void => {
@@ -35,7 +36,7 @@ export default function ChildLayout({ bridged = false }: { bridged?: boolean }):
     <div style={{ borderTop: '1px dashed #ccc', marginTop: 8, paddingTop: 8 }}>
       <p data-demo-bridge-mode>当前应用被桥接：{String(bridged)}</p>
       <p style={{ margin: '4px 0' }}>
-        <strong>React 子应用</strong>（受控 memory 路由）· 本会话挂载次数：{getMountCount()}
+        <strong>React 子应用</strong>（{bridged ? '受控 memory' : '独立 web'} 路由）· 本会话挂载次数：{getMountCount()}
       </p>
       <div style={{ display: 'flex', gap: 8, flexWrap: 'wrap', margin: '8px 0' }}>
         <button onClick={handlePushDemo}>子应用 push /orders?q=演示&amp;page=2</button>

package/examples/templates/showcase/react-remote/src/{bridge.tsx → application.tsx}

@@ -1,18 +1,12 @@
-/**
- * examples/templates/showcase/react-remote/src/bridge.tsx — React 子应用桥接契约（exposes './bridge'）。
- * defineBridgeApp(factory, { routing: true }) 声明路由协议（缺失时宿主启用同步即 MFU-031 占位）。
- * 受控路由 = createReactBridgeRouter（memory data router）：工厂返回 RouterProvider 元素；
- * 宿主未提供路由通道时由插件统一抛 MFU-034（工厂无需手写守卫）；根路径 / 经 loader
- * redirect 规范化到 /orders，由插件以 replace 同步宿主（无新增历史条目）。
- */
-import { redirect } from 'react-router-dom'
-import { defineBridgeApp, createReactBridgeRouter, hasBridgeMount } from '@fulgurjs/federation/react'
+// 独立与桥接使用同一套真实业务路由；每次工厂创建自己的 router。
+import { createBrowserRouter, RouterProvider, redirect } from 'react-router-dom'
+import { defineApplication, createReactBridgeRouter, hasBridgeMount } from '@fulgurjs/federation/react'
 import ChildLayout from './ChildLayout'
 import OrderList from './pages/OrderList'
 import OrderDetail from './pages/OrderDetail'
 import Settings from './pages/Settings'
 import Locked from './pages/Locked'
-import { bindReporter, reportNav } from './child-bus'
+import { createChildReporter, ChildReporterContext, type ChildProps, type ChildReporter } from './child-bus'
 
 /** 初始位置读取用的最小 data router 结构面（避免耦合 react-router 内部类型路径） */
 interface MemoryRouterProbe {
@@ -32,27 +26,33 @@ const routes = [
   },
 ]
 
-export default defineBridgeApp((props, ctx) => {
-  bindReporter(props)
-  const init = ctx!.routing!.getLocation()
+export default defineApplication<ChildProps>((props, ctx) => {
+  const reporter = createChildReporter(props, ctx.signal)
+  const init = ctx.routing?.getLocation()
   // 工厂上下文只属于当前实例；通过 props 传给布局，不写页面全局模式。
   const instanceRoutes = routes.map(route => route.element
     ? { ...route, element: <ChildLayout bridged={hasBridgeMount(ctx)} /> }
     : route)
-  const conn = createReactBridgeRouter(ctx!.routing!, instanceRoutes, { signal: ctx!.signal })
-  // 冷加载（模块级预热未落定的慢路径）时 element 是 LazyRouterProviderHost 包装、无 router
-  // prop——同步读 props.router 会静默跳过初始位置上报。routerReady 是就绪合同：fast 路径
-  // 同步已 resolve、slow 路径在惰性接线完成时 resolve，两条路径行为一致。
-  void conn.routerReady.then((router) => reportInitRedirect(router, init.pathname + init.search + init.hash))
-  return conn.element
+  if (ctx.mode === 'standalone') {
+    const router = createBrowserRouter(instanceRoutes, { basename: import.meta.env.BASE_URL })
+    return { element: <ChildReporterContext.Provider value={reporter}><RouterProvider router={router} /></ChildReporterContext.Provider>, dispose: () => router.dispose() }
+  }
+  const conn = createReactBridgeRouter(ctx.routing!, instanceRoutes, { signal: ctx.signal })
+  // 迟到的就绪回调不得向已卸载实例上报；拒绝由实际挂载链处理。
+  void conn.routerReady.then(router => {
+    if (!ctx.signal.aborted && init) reportInitRedirect(router, init.pathname + init.search + init.hash, ctx.signal, reporter)
+  }, () => {})
+  return { element: <ChildReporterContext.Provider value={reporter}>{conn.element}</ChildReporterContext.Provider>, dispose: conn.dispose }
+
 }, { routing: true })
 
 /** 初始位置上报：createMemoryRouter 同步初始化，'/' 的 loader 重定向在微任务内落定，
  * 下一个宏任务读取即为最终初始位置（订阅式一次性上报会在首个用户导航时才误触发）。 */
-function reportInitRedirect(router: MemoryRouterProbe, initPath: string): void {
+function reportInitRedirect(router: MemoryRouterProbe, initPath: string, signal: AbortSignal, reporter: ChildReporter): void {
   setTimeout(() => {
+    if (signal.aborted) return
     const current = router.state.location.pathname + router.state.location.search + router.state.location.hash
-    reportNav(
+    reporter.reportNav(
       '子应用初始化',
       'init',
       current !== initPath

package/examples/templates/showcase/react-remote/src/child-bus.ts

@@ -1,32 +1,32 @@
-/**
- * examples/templates/showcase/react-remote/src/child-bus.ts — 子应用 → 宿主观测台上报总线。
- * 宿主经 appProps 传入稳定回调 onChildEvent；本模块持有该引用并维护挂载计数。
- * 单页单实例假设：同一宿主页同时只挂一个本子应用实例（路由同步前缀互斥的常规形态）。
- */
-export type DemoChildNavAction = 'push' | 'replace' | 'go' | 'init'
+/** 应用实例自己的观测回调，通过原生 provide/Context 传给实际消费树。 */
+import { createContext, useContext } from 'react'
 
+export type DemoChildNavAction = 'push' | 'replace' | 'go' | 'init'
 export type DemoChildEvent =
   | { type: 'mounted'; mountCount: number }
   | { type: 'nav'; source: string; action: DemoChildNavAction; detail: string }
-
 export type DemoChildReporter = (event: DemoChildEvent) => void
-
-const bus: { report: DemoChildReporter | undefined } = { report: undefined }
-let mountCount = 0
-
-/** 桥接工厂内调用：从 props 快照中取出宿主回调，并上报本次挂载计数 */
-export function bindReporter(props: Record<string, unknown> | undefined): void {
-  const candidate = (props as { onChildEvent?: DemoChildReporter } | undefined)?.onChildEvent
-  bus.report = typeof candidate === 'function' ? candidate : undefined
-  mountCount += 1
-  bus.report?.({ type: 'mounted', mountCount })
+export interface ChildReporter {
+  reportNav(source: string, action: DemoChildNavAction, detail: string): void
+  getMountCount(): number
 }
-
-/** 导航来源上报（子应用 Link / 子应用 push·replace / 子应用 go / 子应用初始化） */
-export function reportNav(source: string, action: DemoChildNavAction, detail: string): void {
-  bus.report?.({ type: 'nav', source, action, detail })
+export interface ChildProps { onChildEvent?: DemoChildReporter }
+// 仅观测编号跨挂载累加；回调和所属实例不放在模块全局。
+let nextMount = 0
+export function createChildReporter(props: ChildProps, signal: AbortSignal): ChildReporter {
+  const mountCount = ++nextMount
+  if (!signal.aborted) props.onChildEvent?.({ type: 'mounted', mountCount })
+  return {
+    getMountCount: () => mountCount,
+    reportNav(source, action, detail) {
+      if (!signal.aborted) props.onChildEvent?.({ type: 'nav', source, action, detail })
+    },
+  }
 }
 
-export function getMountCount(): number {
-  return mountCount
+export const ChildReporterContext = createContext<ChildReporter | null>(null)
+export function useChildReporter(): ChildReporter {
+  const reporter = useContext(ChildReporterContext)
+  if (!reporter) throw new Error('子应用观测台未装配；从 application 工厂启动本应用。')
+  return reporter
 }

package/examples/templates/showcase/react-remote/src/main.tsx

@@ -1,18 +1,2 @@
-/**
- * examples/templates/showcase/react-remote/src/main.tsx — 独立运行入口（仅 dev 占位）。
- * 子应用真实能力经 exposes './bridge' 被宿主加载；直开本页仅作 dev server 健康检查。
- */
-import { createRoot } from 'react-dom/client'
-import type { ReactElement } from 'react'
-
-function Standalone(): ReactElement {
-  return (
-    <div style={{ fontFamily: "'PingFang SC', 'Microsoft YaHei', sans-serif", padding: 24 }}>
-      <h1>react-remote（联邦子应用，5333）</h1>
-      <p>本应用通过 expose ./bridge（defineBridgeApp + routing 协议）被宿主加载。</p>
-      <p>请打开 Vue 宿主桥接页：<a href="http://localhost:5334/br-react/orders">http://localhost:5334/br-react/orders</a></p>
-    </div>
-  )
-}
-
-createRoot(document.getElementById('root')!).render(<Standalone />)
+import application from './application'
+void application.start('#root').catch(console.error)

package/examples/templates/showcase/react-remote/src/pages/Locked.tsx

@@ -4,9 +4,10 @@
  */
 import type { ReactElement } from 'react'
 import { Link } from 'react-router-dom'
-import { reportNav } from '../child-bus'
+import { useChildReporter } from '../child-bus'
 
 export default function Locked(): ReactElement {
+  const { reportNav } = useChildReporter()
   const handleBack = (): void => {
     reportNav('子应用 Link', 'push', '/orders')
   }

package/examples/templates/showcase/react-remote/src/pages/OrderDetail.tsx

@@ -4,9 +4,10 @@
  */
 import type { ReactElement } from 'react'
 import { useLocation, useNavigate, useParams } from 'react-router-dom'
-import { reportNav } from '../child-bus'
+import { useChildReporter } from '../child-bus'
 
 export default function OrderDetail(): ReactElement {
+  const { reportNav } = useChildReporter()
   const params = useParams()
   const location = useLocation()
   const navigate = useNavigate()

package/examples/templates/showcase/react-remote/src/pages/OrderList.tsx

@@ -6,7 +6,7 @@
 import { useMemo, useState } from 'react'
 import type { ChangeEvent, ReactElement } from 'react'
 import { useLocation, useNavigate } from 'react-router-dom'
-import { reportNav } from '../child-bus'
+import { useChildReporter } from '../child-bus'
 
 interface OrderItem {
   id: number
@@ -26,6 +26,7 @@ const ORDERS: OrderItem[] = [
 const PAGE_SIZE = 3
 
 export default function OrderList(): ReactElement {
+  const { reportNav } = useChildReporter()
   const location = useLocation()
   const navigate = useNavigate()
   const search = new URLSearchParams(location.search)

package/examples/templates/showcase/scripts/prod.mjs

@@ -0,0 +1,101 @@
+#!/usr/bin/env node
+/** Standalone template production launcher. Uses only Node and the existing dev.config.json. */
+import fs from 'node:fs'
+import path from 'node:path'
+import http from 'node:http'
+import { fileURLToPath } from 'node:url'
+
+const root = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..')
+const { apps } = JSON.parse(fs.readFileSync(path.join(root, 'scripts/dev.config.json'), 'utf8'))
+if (!Array.isArray(apps) || !apps.length) throw new Error('dev.config.json 未登记应用。')
+
+const mime = { '.html': 'text/html; charset=utf-8', '.js': 'text/javascript', '.css': 'text/css', '.json': 'application/json', '.svg': 'image/svg+xml', '.png': 'image/png', '.jpg': 'image/jpeg', '.woff': 'font/woff', '.woff2': 'font/woff2', '.map': 'application/json' }
+const inside = (file, directory) => file === directory || file.startsWith(directory + path.sep)
+const mounts = apps.map(app => {
+  const dir = path.resolve(root, app.dir, 'dist')
+  if (!inside(dir, root)) throw new Error(`${app.name}: 构建目录超出模板。`)
+  const index = path.join(dir, 'index.html')
+  if (!fs.existsSync(index)) throw new Error(`${app.name}: 缺少 dist/index.html，请先 pnpm build。`)
+  const html = fs.readFileSync(index, 'utf8')
+  const tags = [...html.matchAll(/<script\b[^>]*>/gi)]
+  const tag = tags.find(item => /\btype=["']module["']/i.test(item[0]))?.[0]
+  const src = tag?.match(/\bsrc=["']([^"']+)["']/i)?.[1]
+  if (!src || /^(?:https?:)?\/\//.test(src)) throw new Error(`${app.name}: 无可本地挂载的模块入口。`)
+  // Resolve the actual emitted file suffix, rather than guessing base from an app name.
+  const pathname = decodeURIComponent(new URL(src, 'http://template.local/').pathname)
+  const parts = pathname.split('/').filter(Boolean)
+  const bases = []
+  for (let i = 0; i < parts.length; i++) {
+    const file = path.resolve(dir, ...parts.slice(i))
+    if (inside(file, dir) && fs.existsSync(file) && fs.statSync(file).isFile()) bases.push('/' + parts.slice(0, i).join('/') + (i ? '/' : ''))
+  }
+  if (bases.length !== 1) throw new Error(`${app.name}: 无法唯一对应构建入口 ${src}；检查 Vite base 和干净构建输出。`)
+  return { ...app, dir, prefix: bases[0] }
+})
+const hosts = mounts.filter(app => app.host)
+if (!hosts.length) throw new Error('dev.config.json 未登记 host:true 的宿主。')
+const ports = new Set()
+const servers = []
+let stopping = false
+function stop(code = 0) {
+  if (stopping) return
+  stopping = true
+  for (const server of servers) server.close()
+  const timer = setTimeout(() => {
+    for (const server of servers) server.closeAllConnections?.()
+    process.exit(code)
+  }, 1000)
+  timer.unref()
+  process.exitCode = code
+}
+process.once('SIGINT', () => stop(0))
+process.once('SIGTERM', () => stop(0))
+process.once('uncaughtException', error => { console.error(error); stop(1) })
+
+for (const host of hosts) {
+  if (!Number.isInteger(host.port) || host.port < 1 || host.port > 65535 || ports.has(host.port)) throw new Error(`无效或重复宿主端口：${host.port}`)
+  ports.add(host.port)
+  const site = [host, ...mounts.filter(app => !app.host)].sort((a, b) => b.prefix.length - a.prefix.length)
+  const prefixes = new Set()
+  for (const app of site) {
+    if (prefixes.has(app.prefix)) throw new Error(`${host.name}: 构建 base ${app.prefix} 冲突；宿主和远程不能部署在同一路径。`)
+    prefixes.add(app.prefix)
+  }
+  const server = http.createServer((req, res) => {
+    try {
+      const url = new URL(req.url, `http://localhost:${host.port}`)
+      if (url.pathname === '/' && host.prefix !== '/') {
+        res.writeHead(302, { location: host.prefix, 'cache-control': 'no-cache' })
+        return res.end()
+      }
+      const app = site.find(item => url.pathname === item.prefix.slice(0, -1) || url.pathname.startsWith(item.prefix))
+      if (!app) { res.writeHead(404); return res.end('未登记此部署路径') }
+      const relative = decodeURIComponent(url.pathname.slice(app.prefix.length)) || 'index.html'
+      let file = path.resolve(app.dir, relative)
+      if (!inside(file, app.dir)) { res.writeHead(403); return res.end() }
+      if (!fs.existsSync(file) || fs.statSync(file).isDirectory()) {
+        if (path.extname(relative)) { res.writeHead(404); return res.end('资源不存在；不会回退成HTML') }
+        file = path.join(app.dir, 'index.html')
+      }
+      const stable = /(?:^|\/)(?:index\.html|fulgurjs-(?:remoteEntry\.js|manifest\.json)|_app\.config\.js)$/.test(file)
+      res.writeHead(200, {
+        'content-type': mime[path.extname(file)] ?? 'application/octet-stream',
+        'cache-control': stable ? 'no-cache' : 'public, max-age=31536000, immutable',
+        'access-control-allow-origin': '*',
+      })
+      res.end(fs.readFileSync(file))
+    } catch (error) {
+      console.error(`生产请求失败：${error.message}`)
+      if (!res.headersSent) res.writeHead(400)
+      res.end('无效请求或资源不可读')
+    }
+  })
+  servers.push(server)
+  server.on('error', error => {
+    console.error(`${host.name}:${host.port} 启动失败：${error.message}；停止本次全部生产服务器，不会按端口杀已有进程。`)
+    stop(1)
+  })
+  server.listen(host.port, '127.0.0.1', () => {
+    if (!stopping) console.log(`生产宿主 ${host.name}: http://localhost:${host.port}${host.prefix}（仅dist，无开发服务器）`)
+  })
+}

package/examples/templates/showcase/vue-host/package.json

@@ -11,7 +11,7 @@
     "types": "fulgurjs types"
   },
   "dependencies": {
-    "@fulgurjs/federation": "6.8.5",
+    "@fulgurjs/federation": "6.9.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "vue": "^3.5.13",