Skip to content

CmdWise 技术栈分析与选择

文章目的

本文记录 CmdWise、文档与应用端在「前端-后端-部署」层面的技术选型思路,方便后续维护与扩展。

1. 前端 Website

1.1 技术栈

目的方案
页面渲染HTML + JavaScript + Tailwind CSS
图标Lucide
深浅色Tailwind Dark Mode

为什么不用 Vue / React?

  1. 启动速度:静态 HTML 无需构建即可预览,适合快速迭代。
  2. 学习成本:久未使用 Vue/React,需要时间找回状态。
  3. AI 生成友好:大模型更擅长生成纯 HTML 片段,保存即用。

1.2 开发流程

  1. 依据 ui-style-guide 设计样式。
  2. 参照 index.html 结构,由 Cursor 逐页生成。
  3. 手动微调确保一致性。

1.3 部署(Cloudflare Pages)

bash
wrangler deploy --minify
  • 部署完成后直接绑定自定义域名即可获得 HTTPS,无需自行申请证书。
  • 静态站点,无额外服务器开销。

2. 文档 Docs

2.1 工具

  • VitePress:支持中英文文档切换。
  • 遵循SEO与编辑风格准则,借助 AI 辅助完成排版与润色。

2.2 流程

  1. 先确定目录结构 → vitepress config
  2. 让 AI 评审结构合理性。
  3. 编写中文初稿 → 按 SEO 要求润色 → 人工检查修改 → AI生成英文稿 。

3. 后端 Server

3.1 框架

  • Hono — 原生集成 Cloudflare Workers,并提供 LLM 辅助文档,方便 AI 工具直接读取接口说明、按框架规范生成代码。

3.2 云服务

功能服务
运行时Cloudflare Workers
数据库D1 (SQLite)
对象存储R2

自然地选择了 Cloudflare 全家桶:Workers + D1 + R2,一行配置即可打通,几乎零运维成本。

3.3 本地开发

  • wrangler dev 自动在 .wrangler/state 创建本地 D1 & R2,并支持 断点调试,开发体验接近本地 Node 服务。
  • D1 可直接用可视化 SQLite 客户端打开;在 Cloudflare 控制台也能浏览数据,但推荐安装浏览器插件 Drizzle Studio,操作体验更顺手。

3.4 部署注意事项

bash
wrangler deploy --minify
  • 只需在项目根添加 wrangler.jsoncwrangler.toml,然后执行上面的命令即可部署。
  • wrangler.toml 中添加 keep_vars = true,避免部署后环境变量被重置。
  • 针对需要加密的变量,可通过 wrangler secret 命令行快速设置,比在 Dashboard 手动输入更高效;当然 Dashboard 也支持一次粘贴多行变量,同样方便。

4. 桌面应用 App

备选方案:Electron vs Tauri

指标ElectronTauri
社区 & 生态★★★★★★★★★☆
跨平台macOS / Windows / Linux
调试体验成熟较新

AI (Cursor) 在评估需求后选择 Electron + React

原因

  1. Electron 生态完善,示例多,AI 训练数据丰富,便于生成代码。
  2. React 与 Electron 组合成熟,社区案例丰富,降低踩坑概率。

5. 结语

选择 Cloudflare 全家桶 + 简单前端栈,使 部署成本低开发节奏快;借助 AI 能力,可在熟悉的技术生态中快速验证想法并持续迭代。