From 4c1de99d65a21575dd2b532d223623667f1331c2 Mon Sep 17 00:00:00 2001
From: QiuSW <105186638@qq.com>
Date: Wed, 8 Jul 2026 22:17:42 +0800
Subject: [PATCH] fix: speed up wails dev gui startup

---
 README.md                         |  1 +
 docs/03-tech-stack.md             |  8 ++++++++
 docs/current-state.md             |  8 ++++++++
 frontend/package.json             |  3 ++-
 frontend/src/App.vue              |  3 ++-
 frontend/src/pages/Home/Index.vue |  1 +
 progress.md                       | 25 +++++++++++++++++++++++++
 7 files changed, 47 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index ce6a705..0f28548 100644
--- a/README.md
+++ b/README.md
@@ -67,6 +67,7 @@ Windows 下也可以直接运行：
 ```
 
 `dev.bat` 会从 `9245` 开始选择一个空闲 Vite 端口，避免已有 dev server 占用端口时无法打开 GUI。
+开发启动使用快速前端 dev 构建以尽快打开桌面窗口；提交前仍以 `npm run build` 做完整 TypeScript 检查和生产构建。
 
 ## 维护约定
 
diff --git a/docs/03-tech-stack.md b/docs/03-tech-stack.md
index b3dc946..08f7a5f 100644
--- a/docs/03-tech-stack.md
+++ b/docs/03-tech-stack.md
@@ -76,6 +76,13 @@ cd frontend
 npm run build
 ```
 
+前端类型检查：
+
+```powershell
+cd frontend
+npm run typecheck
+```
+
 后端编译：
 
 ```powershell
@@ -108,6 +115,7 @@ Windows 快捷脚本：
 ```
 
 `dev.bat` 会先切到项目根目录，把 Go bin 加入当前进程 PATH，再从 `9245` 开始选择空闲端口运行 `wails3 dev`。
+开发启动链路使用 `npm run build:dev` 做快速前端 dev 构建，避免 `vue-tsc` 阻塞 GUI 打开；完整类型检查仍由 `npm run build` 或 `npm run typecheck` 执行。
 
 Windows build 资源：
 
diff --git a/docs/current-state.md b/docs/current-state.md
index b440945..c90d966 100644
--- a/docs/current-state.md
+++ b/docs/current-state.md
@@ -45,6 +45,7 @@
 go test ./...
 cd frontend
 npm run build
+npm run typecheck
 cd ..
 go build -o bin\cmbone.exe .
 ```
@@ -70,6 +71,7 @@ wails3 build
 - `npm install` 当前报告 3 个 moderate audit findings，后续如做依赖治理应单独开任务。
 - 前端构建当前有 Browserslist 数据过期和 chunk 大小警告，不阻塞生产构建。
 - Windows 快捷脚本依赖 `go env GOPATH` 下的 `bin\wails3.exe`，如果未安装 Wails CLI，先按 README 安装固定版本。
+- `dev.bat` 为了尽快打开 GUI，使用不含 `vue-tsc` 的 `build:dev`；提交前必须继续运行 `npm run build`。
 
 ## 最近验证
 
@@ -106,6 +108,12 @@ wails3 build
 - 使用同样 PATH 逻辑执行 `wails3 dev -help` 通过。
 - `.\init.ps1` 通过。
 
+同日修复 `dev.bat` 启动 GUI 等待过长问题：
+
+- `frontend` 的 `build:dev` 改为快速 Vite dev 构建，避免 `vue-tsc` 在开发启动链路中长时间阻塞窗口打开。
+- 新增 `npm run typecheck`，正式质量门禁仍由 `npm run build` 覆盖类型检查和生产构建。
+- 已验证 `dev.bat` 能进入 `windows:run`，拉起 `bin/cmbone.exe`，并创建可见主窗口。
+
 ## 下一步
 
 从 [`06-tasks.md`](06-tasks.md) 领取第一个 `TODO` 任务。目前建议先做 `T-012`：搭建主应用路由骨架。
diff --git a/frontend/package.json b/frontend/package.json
index 5b2c803..1371c49 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -5,7 +5,8 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build:dev": "vue-tsc && vite build --minify false --mode development",
+    "typecheck": "vue-tsc",
+    "build:dev": "vite build --minify false --mode development",
     "build": "vue-tsc && vite build --mode production",
     "preview": "vite preview"
   },
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 2c5505b..798fe7b 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { onMounted} from 'vue'
+import { ConfigProvider } from 'ant-design-vue'
+import { onMounted } from 'vue'
 import { themeConfig } from './utils/ThemeManager' 
 const applyTheme = () => {
   const userTheme = localStorage.getItem('theme')
diff --git a/frontend/src/pages/Home/Index.vue b/frontend/src/pages/Home/Index.vue
index d520f2a..35bb19f 100644
--- a/frontend/src/pages/Home/Index.vue
+++ b/frontend/src/pages/Home/Index.vue
@@ -72,6 +72,7 @@ async function handleOCR() {
     class="flex h-screen w-screen items-start justify-center overflow-hidden pt-8 font-sans select-none bg-gray-100 drag-region dark:bg-gray-900">
     <TransitionGroup name="card" tag="div"> 
       <div
+        key="ocr-card"
         class="flex-1  w-[300px] rounded-2xl bg-white/80  dark:bg-gray-700 dark:text-white backdrop-blur-md px-4 py-2 shadow-[0_8px_24px_rgba(0,0,0,0.12)] transition">
         <!-- 图片区域 -->
         <div
diff --git a/progress.md b/progress.md
index 691da0f..24fcac0 100644
--- a/progress.md
+++ b/progress.md
@@ -125,3 +125,28 @@
   - `npm install` 仍报告 3 个 moderate audit findings。
   - 前端构建仍提示 Browserslist 数据过期。
   - Vite 仍提示生产 chunk 大于 500 kB。
+
+### 修复 dev.bat GUI 启动等待过长
+
+- 任务：用户反馈 `dev.bat` 仍然看不到 GUI 后，继续排查 Windows dev 启动链路。
+- 发现：
+  - 清理旧的无窗口 `bin/cmbone.exe` 残留进程后，`dev.bat` 可以进入 `windows:run`。
+  - GUI 不是完全无法创建，而是开发启动链路先执行 `vue-tsc && vite build --minify false --mode development`，窗口要等该步骤完成后才出现。
+  - 窗口枚举确认主窗口可见，标题为 `main`，第二窗口保持隐藏。
+- 结果：
+  - `frontend/package.json` 新增 `typecheck` 脚本。
+  - `build:dev` 改为只执行快速 Vite dev 构建，避免开发启动时被 `vue-tsc` 长时间阻塞。
+  - `npm run build` 仍保留 `vue-tsc`，提交前完整质量门禁不变。
+  - 修复 `App.vue` 的 `ConfigProvider` 导入和第二窗口 OCR 卡片的 `TransitionGroup` key 警告。
+- 验证：
+  - `go test ./...` 通过。
+  - `cd frontend && npm run typecheck` 通过。
+  - `cd frontend && npm run build:dev` 通过，Vite dev 构建约 1 秒完成。
+  - `cd frontend && npm run build` 通过。
+  - `go build -o bin\cmbone.exe .` 通过。
+  - `cmd /c build.bat` 通过。
+  - `dev.bat` 烟测通过，进入 `windows:run` 后拉起 `bin/cmbone.exe`，窗口枚举显示主窗口 `main` 可见，第二窗口 `second` 保持隐藏。
+- 非阻塞警告：
+  - `cmd /c build.bat` 仍提示 `wails3 build` 是 `wails3 task` 的 alias。
+  - `npm install` 仍报告 3 个 moderate audit findings。
+  - 前端构建仍提示 Browserslist 数据过期和 chunk 大小警告。