@xfe-repo/web-app 1.6.3 → 2.0.0-beta.1

package/README.md

@@ -1,6 +1,65 @@
 # `@xfe-repo/web-app`
 
-web框架基础库
+统一管理 Web 配置、页面入口、类型检查与构建；当前内部使用 React Router 8 Framework Mode 和 Vite 8。
+
+要求 Node.js `>=22.22.0`、React/ReactDOM `>=19.2.7`。业务项目只维护：
+
+- `src/layout.tsx`（可选），只编写业务 Provider 与布局，接收 `children`
+- `src/app.ts`，服务端上下文存在时再增加 `src/app.server.ts`
+- `src/pages/**/index.tsx`
+- `xfe.json.webapp`
+
+`react-router.config`、Vite 配置由 app 包维护，路由收集器由 `@xfe-repo/web-router/routes` 维护；CLI 在 `node_modules/.cache/xfe-web/react-router`
+生成 React Router 必需的隐藏 shim。`home/index.tsx`、`index/index.tsx` 和旧的
+`_index/index.tsx`/`route.tsx` 映射 `/`；页面目录支持 `$id`、`[id]` 动态参数。普通页面只需：
+
+不能直接把隐藏 app 生成到 `@xfe-repo/web-app` 包目录：React Router 会按物理路径发现 config/routes，dev watcher 和 typegen 还会向相邻目录写入状态；共享包目录既不属于业务项目，也会让多个项目互相覆盖。项目本地的 `node_modules/.cache` 可写、默认忽略，且仍处于依赖解析范围内。
+
+客户端与服务端复用已锁定版本的 React Router 官方默认 entry，业务项目不再维护 entry 文件；服务端入口由 CLI 显式转发，避免底层工具向业务清单添加 `isbot` 并自动安装。HTML 文档、路由出口与默认 loading/error 由框架生成。
+
+`vite`、`less` 和 `isbot` 由本包安装和维护；SSR 产物打包 `isbot`，不要求部署项目另装它。`react-router` 由本包与 `web-router` 固定为同一版本，业务从 `@xfe-repo/web-router` 导入路由 API 和类型，无需直接声明这四个依赖。
+
+```tsx
+export const page = app.registerPage(config, Component)
+```
+
+默认使用框架的 404/500 边界，业务无需创建 `pages/$`；可在 `layout.tsx` 直接导出 `ErrorView({ error })` 自定义错误展示。
+
+```json
+{
+  "webapp": {
+    "renderMode": "client",
+    "title": "商户后台",
+    "port": 3001
+  }
+}
+```
+
+`renderMode: "client"` 生成 SPA 静态产物 `build/client/index.html`；`xfe-web start` 使用框架内的 Express 静态服务，支持 `basename` 下的深链接回退，缺失的 `/assets` 文件仍返回 404，不需要 server bundle 或运行时 JWT 私钥。现有 Docker 启动命令无需修改，也可把 `build/client` 交给外部静态托管并配置 index.html 回退。`"server"`（兼容旧项目的默认值）保留服务端构建与 React Router 服务；切换为 SSR 前仍需实现请求隔离的 Store/Context。其他可选项：`basename`、`host`、`lang`（默认 `zh-CN`）、`themeColor`。`HOST/PORT` 环境变量可覆盖 SPA 启动地址。修改启动配置后重新运行 CLI。
+
+原生扩展保持兼容：已有 `src/root.tsx` 优先于默认根布局；其中的 Framework value exports 使用直接的 `export const/function/class` 声明。原生 `route.tsx` 和标准导出仍可使用，其 API 和类型同样从 `@xfe-repo/web-router` 导入，不要求业务另装 React Router。
+
+命令保持不变：
+
+```bash
+xfe-web dev
+xfe-web build
+xfe-web typegen
+xfe-web typecheck
+xfe-web start
+xfe-web config
+```
+
+`typecheck` 先在与 dev/build 相同的隐藏目录生成路由类型，再运行 TypeScript。项目 tsconfig 继承 `@xfe-repo/web-app/tsconfig.json`，只保留业务别名和源码范围；客户端环境类型引用 `@xfe-repo/web-app/client`，无需配置生成类型的路径。重复生成只更新内容变化的文件，不删除正在运行的开发缓存。
+
+业务 `package.json` 的类型检查脚本使用 `"typecheck": "xfe-web typecheck"`；类型声明文件加入 `/// <reference types="@xfe-repo/web-app/client" />`，不再直接配置 `vite/client` 或隐藏缓存的 `rootDirs/include`。
+
+框架将 React、ReactDOM、React Redux 与 RTK 去重到消费应用的依赖，支持 workspace 和本地链接联调。React 组件仍依赖 React；这里隔离的是路由和构建实现，不承诺任意 UI 技术栈之间零修改迁移。
+
+`dev` 和 SSR `start` 获取完整 JWT 环境，SPA `start` 不获取私钥；
+`build` 只向客户端注入 aud/keyId，明确丢弃私钥。
+
+SSR `start` 使用与构建一致的隐藏工作目录，使官方 serve 正确解析 `build/client` 静态资源；启动时仅保证该目录存在，不读取 `src/pages` 或重新生成入口。
 
 构建会先加载 `react-app-polyfill/stable`，并在应用原有 browserslist 的基础上，补充 Edge 18、Chrome 64、Firefox 60、Safari/iOS 12 及以上的 JS 编译目标，业务代码和第三方依赖使用同一目标。
 

package/client.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

package/deploy/.drone.yml

@@ -18,17 +18,19 @@ resources:
 steps:
   - name: install
     pull: if-not-exists
-    image: xhj-prod-registry-vpc.cn-hangzhou.cr.aliyuncs.com/xhj-image-common/node-base:20.17.0-pnpm
+    image: node:22.22.0-bookworm
     volumes:
       - name: node-modules
         path: /drone/src/node_modules
     commands:
+      - corepack enable
+      - corepack prepare pnpm@10.30.3 --activate
       - pnpm config set registry https://registry.npmmirror.com
       - pnpm i
 
   - name: build
     pull: if-not-exists
-    image: xhj-prod-registry-vpc.cn-hangzhou.cr.aliyuncs.com/xhj-image-common/node-base:20.17.0-pnpm
+    image: node:22.22.0-bookworm
     resources:
       limits:
         memory: 8192MiB
@@ -36,11 +38,16 @@ steps:
       - name: node-modules
         path: /drone/src/node_modules
     commands:
+      - corepack enable
+      - corepack prepare pnpm@10.30.3 --activate
       - cp -r node_modules/@xfe-repo/web-app/deploy deploy
       - export NODE_OPTIONS="--max-old-space-size=8192"
-      - export REACT_APP_RELEASE=$DRONE_REPO_NAME@${DRONE_TAG:CI_COMMIT_SHA}
-      - echo -n "$REACT_APP_RELEASE" > deploy/static/release
+      - export XFE_RELEASE=$DRONE_REPO_NAME@${DRONE_TAG:CI_COMMIT_SHA}
+      - export REACT_APP_RELEASE=$XFE_RELEASE
+      - printf '%s' "$XFE_RELEASE" > deploy/static/release
+      - cp deploy/static/release deploy/static/check-update
       - pnpm build
+      - cp -a node_modules deploy/modules
 
   - name: image-build
     image: xhj-prod-registry-vpc.cn-hangzhou.cr.aliyuncs.com/image-common/kaniko:latest

package/deploy/Dockerfile

@@ -1,10 +1,18 @@
-FROM xhj-prod-registry-vpc.cn-hangzhou.cr.aliyuncs.com/xhj-image-common/nginx-base
+FROM node:22.22.0-bookworm-slim
 
-WORKDIR /code/www/deploy/webroot/app/current
+WORKDIR /app
 
-COPY build/client ./
+ENV NODE_ENV=production
+ENV HOST=0.0.0.0
+ENV PORT=3000
 
-COPY deploy/nginx.conf /etc/nginx/conf.d/default.conf
+COPY build ./build
+COPY deploy/static ./build/client
+COPY deploy/modules ./node_modules
+COPY package.json xfe.json ./
 
-# 拷贝静态文件
-COPY deploy/static ./
+EXPOSE 3000
+
+USER node
+
+CMD ["./node_modules/.bin/xfe-web", "start"]

package/deploy/helm/templates/deployment.yaml

@@ -30,8 +30,12 @@ spec:
             requests:
               cpu: "0.01"
               memory: "100Mi"
-          {{if $.Values.hostPrefix}}
           env:
+            - name: HOST
+              value: "0.0.0.0"
+            - name: PORT
+              value: "3000"
+          {{if $.Values.hostPrefix}}
             - name: HOST_PREFIX
               value: "{{ $.Values.hostPrefix }}"
           {{end}}
@@ -40,21 +44,4 @@ spec:
             - configMapRef:
                 name: "app-common-config"
           {{- end }}
-          volumeMounts:
-            - mountPath: /var/log/nginx
-              subPath: "xfe/{{ $.Values.app }}"
-              name: log
-          command:
-            - bash
-            - "-c"
-            - |
-              nginx
-              while :
-              do
-              sleep 10
-              done
-      volumes:
-        - name: log
-          hostPath:
-            path: /var/log
 ---

package/deploy/helm/templates/svc.yaml

@@ -9,4 +9,4 @@ spec:
   ports:
     - port: 80
       name: http
-      targetPort: 80
+      targetPort: 3000