- Added a new task store in `src-react/stores/task.ts` to manage tasks and their statuses. - Implemented functions for creating, executing, and retrying tasks, along with handling task progress and completion. - Introduced persistence for tasks using IPC. - Created utility functions for normalizing room types and building subtasks. - Added a new CSS file for global styles in `src-react/styles.css`. - Created runtime types in `src-react/types/runtime.ts` and exported them. - Updated the main entry points for Vue and React applications to support dynamic framework loading. - Refactored chat model interfaces and utility functions into `src/shared/chat-model.ts`. - Updated TypeScript configuration to include paths for React components and types. - Enhanced Vite configuration to support both Vue and React frameworks.
137 lines
4.3 KiB
Markdown
137 lines
4.3 KiB
Markdown
# zn-ai Vue 退场清单
|
||
|
||
目标:在 React 接管默认入口后,按清单删除所有仅服务 Vue 的资产,最终收敛为 `React-only`。
|
||
|
||
## 当前状态
|
||
|
||
- `Home` 的 React 主链路已经接入真实 `chat/task/channel` store、真实 IPC,以及 `TaskOperationDialog / AddChannelDialog`。
|
||
- `Home` 这批旧 Vue 文件目前仍被 `src/router/index.ts -> src/pages/home/index.vue` 的 Vue fallback 引用,因此本轮不能直接删除。
|
||
- 其余主页面虽然已有 `src-react/pages/*` 路由壳,但当前大多还是占位页,尚不满足“删除 Vue 路由与页面”的退场条件。
|
||
|
||
当前删除策略:
|
||
|
||
1. 先停止新增对 `src/pages/home/**`、`src/stores/chat.ts`、`src/stores/task.ts`、`src/stores/channel.ts` 的 React 侧依赖。
|
||
2. 等 `Agents / Knowledge / Skills / Cron / Scripts / Setting / Login` 的 React 页面完成真实迁移后,再统一删除 `src/router/*`、`.vue` 页面和旧 Pinia store。
|
||
3. 在此之前,只做“替换引用”和“收口依赖”,不做会破坏 Vue fallback 的物理删除。
|
||
|
||
## 1. 入口与切换层
|
||
|
||
- `src/main-vue.ts`
|
||
- `src/framework.ts`
|
||
- `src/main.ts`
|
||
- `src/App.vue`
|
||
- `src/permission.ts`
|
||
|
||
退场标准:
|
||
|
||
- `src/main.ts` 不再分流 Vue 入口。
|
||
- `src/framework.ts` 不再保留 `vue` 分支。
|
||
- `src/main-vue.ts` 删除。
|
||
- `src/App.vue` 和 `src/permission.ts` 只要还依赖 Vue 生命周期或 Router 守卫,就必须迁入 React 后再删除旧文件。
|
||
|
||
## 2. Vue 页面
|
||
|
||
以下页面都属于 Vue 退场范围,React 版本完成后删除:
|
||
|
||
- `src/pages/home/index.vue`
|
||
- `src/pages/home/ChatBox.vue`
|
||
- `src/pages/home/ChatHistory.vue`
|
||
- `src/pages/home/TaskCenter.vue`
|
||
- `src/pages/home/components/*.vue`
|
||
- `src/pages/login/index.vue`
|
||
- `src/pages/agents/index.vue`
|
||
- `src/pages/knowledge/index.vue`
|
||
- `src/pages/skills/index.vue`
|
||
- `src/pages/skills/components/*.vue`
|
||
- `src/pages/cron/index.vue`
|
||
- `src/pages/cron/components/*.vue`
|
||
- `src/pages/setting/index.vue`
|
||
- `src/pages/setting/components/*.vue`
|
||
|
||
建议删除顺序:
|
||
|
||
1. 先迁 `home`,再迁其余业务页。
|
||
2. 先删纯展示/表单页,再删聊天主链路。
|
||
3. 最后统一清理页面下的 Vue 子组件目录。
|
||
|
||
## 3. Vue Store
|
||
|
||
以下 `Pinia` store 是 Vue 体系的核心状态,React 完成对等实现后删除:
|
||
|
||
- `src/stores/chat.ts`
|
||
- `src/stores/providers.ts`
|
||
- `src/stores/channel.ts`
|
||
- `src/stores/cron.ts`
|
||
- `src/stores/script.ts`
|
||
- `src/stores/skills.ts`
|
||
- `src/stores/task.ts`
|
||
- `src/stores/theme.ts`
|
||
- `src/stores/locale.ts`
|
||
- `src/stores/update.ts`
|
||
- `src/stores/userinfo.ts`
|
||
- `src/stores/sharedStore.ts`
|
||
|
||
退场标准:
|
||
|
||
- React 侧已具备对等 store 后,旧 Pinia store 不再被任何路由或组件引用。
|
||
- `src/stores/*` 不再承担主流程状态。
|
||
|
||
## 4. Router 与守卫
|
||
|
||
需要替换或删除的 Vue 路由资产:
|
||
|
||
- `src/router/index.ts`
|
||
- `src/constant/menus.ts`
|
||
- `src/permission.ts`
|
||
- `src/components/SideMenus/index.vue`
|
||
|
||
退场标准:
|
||
|
||
- 路由切换完全由 React Router 接管。
|
||
- 菜单配置不再依赖 Vue 路由表。
|
||
- 登录守卫迁到 React 侧后,旧守卫文件删除。
|
||
|
||
## 5. 仅服务 Vue 的共享组件
|
||
|
||
这些组件如果只被 Vue 页面使用,应在 React 对等实现后删除:
|
||
|
||
- `src/components/Layout/index.vue`
|
||
- `src/components/Layout/TitleBar/index.vue`
|
||
- `src/components/NativeTooltip/index.vue`
|
||
- `src/components/Pagination/index.vue`
|
||
- `src/components/TitleSection/index.vue`
|
||
|
||
## 6. Vue 依赖与构建项
|
||
|
||
`package.json` 中后续需要删除或替换的 Vue 依赖:
|
||
|
||
- `vue`
|
||
- `vue-router`
|
||
- `pinia`
|
||
- `vue-i18n`
|
||
- `element-plus`
|
||
- `@vueuse/core`
|
||
- `@vitejs/plugin-vue`
|
||
- `@lucide/vue`
|
||
- `@remixicon/vue`
|
||
- `vue-codemirror`
|
||
- `vue-markdown-render`
|
||
|
||
`vite.config.ts` 中后续需要清理的 Vue 构建项:
|
||
|
||
- `vue()` 插件
|
||
- `unplugin-auto-import` 的 Vue 自动导入配置
|
||
- 与 Vue 页面强绑定的 `src/auto-imports.d.ts` 生成链路
|
||
- 所有仅为 Vue 入口保留的分支判断
|
||
|
||
## 7. 最终删除判定
|
||
|
||
只有在以下条件都满足后,才允许进入最终清理提交:
|
||
|
||
- 默认入口只剩 React。
|
||
- 所有主页面都已迁到 `src-react/`。
|
||
- `src/pages/**` 中不再存在可执行的 Vue 页面。
|
||
- `src/stores/**` 中不再存在被运行时调用的 Vue 状态。
|
||
- `package.json` 和 `vite.config.ts` 中不再保留 Vue 构建依赖。
|
||
- 仓库中不再需要 `VITE_UI_FRAMEWORK=vue` 作为运行开关。
|