## 根因
设置页 `navigate('/settings')` 导致 React Router `/*` 的 index
路由不匹配,HomePage 被卸载重挂载,所有 useState 回到默认值。
## 修复(6 文件)
- event-bus.ts: 新增 OPEN_SETTINGS 事件
- nav-config.ts: 设置按钮 action: 'navigate' → 'button',去路由化
- NavBar.tsx: button case 中 emit(OPEN_SETTINGS)
- SettingsPage.tsx: 去路由化,改为 Modal 居中叠加 + open/onClose props,
使用 antd 6.x 正确 API destroyOnHidden(非废弃的 destroyOnClose),
mask={{ closable: false }} + keyboard={false} 仅允许 X 按钮关闭
- router/index.tsx: 移除 SettingsPage 渲染
- App.tsx: 添加 SettingsPage Modal,事件驱动(与 LoginPage 模式一致)
## UX 优化(2 文件)
- HomeContent.tsx: 右侧分隔条移除多余 marginLeft,左右视觉对称
- BannerCarousel.tsx: 新增关闭按钮,session 级别 useState 隐藏,
不做 localStorage 持久化,确保每次启动重新展示
## 架构原则
确立 QT 多窗口模型 → Web 映射:叠加层走 Modal/Drawer + 事件总线,
主页面不卸载;真正的视图切换才用 React Router。
## 文档同步
- TODO.md: 移除已完成项详细记录,精简为未完成待办
- WORKLOG.md: 追加 2026-06-07 完整工作日志
- PROJECT.md: 更新路由/叠加层架构说明
- CHANGELOG.md: 追加 v0.0.13 条目
- ARCHITECTURE.md: 更新日期 + 新增叠加层模式章节
108 lines
4.3 KiB
TypeScript
108 lines
4.3 KiB
TypeScript
import {defineConfig, loadEnv} from 'vite';
|
||
import path from 'node:path';
|
||
import electron from 'vite-plugin-electron/simple';
|
||
import react from '@vitejs/plugin-react';
|
||
import renderer from 'vite-plugin-electron-renderer';
|
||
import tailwindcss from '@tailwindcss/vite';
|
||
import {visualizer} from 'rollup-plugin-visualizer';
|
||
|
||
const __dirname = import.meta.dirname;
|
||
|
||
// ============================================================
|
||
// 热更新说明
|
||
// ============================================================
|
||
// 修改 src/ → React Fast Refresh(组件级热替换,不丢失状态)
|
||
// 修改 electron/ → 主进程重建 + Electron 自动重启(预期行为)
|
||
// 修改 shared/ → 因为 shared/ 被主进程引用,也会触发重启
|
||
// 如需避免,可把仅渲染进程用的类型放到 src/types/
|
||
// ============================================================
|
||
|
||
export default defineConfig(({mode}) => {
|
||
// 加载 .env.development / .env.production 中的环境变量
|
||
const env = loadEnv(mode, __dirname, '');
|
||
|
||
return {
|
||
plugins: [
|
||
react(),
|
||
tailwindcss(),
|
||
electron({
|
||
main: {
|
||
// 主进程入口
|
||
entry: 'electron/main.ts',
|
||
// 只监听 electron/ 目录,避免 shared/ 变更误触重启
|
||
// (默认会监听 entry 文件的所有依赖,包括 shared/)
|
||
},
|
||
preload: {
|
||
input: path.join(__dirname, 'electron/preload.ts'),
|
||
},
|
||
}),
|
||
renderer(),
|
||
// 打包体积分析(仅 ANALYZE=true 时生成 stats.html)
|
||
process.env.ANALYZE &&
|
||
visualizer({
|
||
open: true,
|
||
gzipSize: true,
|
||
brotliSize: true,
|
||
filename: 'dist/stats.html',
|
||
}),
|
||
].filter(Boolean),
|
||
resolve: {
|
||
alias: {
|
||
'@': path.resolve(__dirname, 'src'),
|
||
'@shared': path.resolve(__dirname, 'shared'),
|
||
},
|
||
},
|
||
// ============================================================
|
||
// 编译时注入环境变量到主进程
|
||
// 主进程中的 process.env.xxx 会在编译时被替换为实际值
|
||
// 这样无需在 OS 环境中设置这些变量
|
||
// ============================================================
|
||
define: {
|
||
'process.env.UPDATE_API_URL': JSON.stringify(env.UPDATE_API_URL || 'https://www.heixiu.com'),
|
||
'process.env.EDITION': JSON.stringify(env.EDITION || 'personal'),
|
||
},
|
||
// ============================================================
|
||
// 开发服务器 & HMR 配置
|
||
// ============================================================
|
||
server: {
|
||
port: 5173,
|
||
strictPort: true,
|
||
host: "0.0.0.0",
|
||
watch: {
|
||
// Windows 上默认的 fs.watch 有时不稳定,
|
||
// 如果文件保存后界面无反应,可临时开启 usePolling
|
||
// usePolling: true,
|
||
// interval: 100,
|
||
// 忽略不需要监听的目录,减少 CPU 占用
|
||
ignored: ['**/node_modules/**', '**/dist/**', '**/dist-electron/**', '**/release/**', '**/test-server/**', "**/**/*.md"],
|
||
},
|
||
// HMR 配置
|
||
hmr: {
|
||
// 在浏览器控制台显示 HMR 覆盖层(错误/警告时)
|
||
overlay: true,
|
||
},
|
||
proxy: mode === "development" ? {
|
||
"/api": {
|
||
target: env.VITE_API_BASE_URL || "http://192.168.110.84:8000", // 从环境变量读取,默认为本地后端
|
||
changeOrigin: true,
|
||
bypass: (req) => {
|
||
if (req.headers.accept?.includes('text/html')) return '/index.html'
|
||
},
|
||
},
|
||
'/uploads': {
|
||
target: env.VITE_API_BASE_URL ?? 'http://192.168.110.84:8000',
|
||
changeOrigin: true,
|
||
},
|
||
} : undefined, // 生产环境不启用代理
|
||
},
|
||
build: {
|
||
rollupOptions: {
|
||
output: {},
|
||
},
|
||
},
|
||
preview: {
|
||
port: 5173,
|
||
},
|
||
};
|
||
});
|