CNB 云原生开发环境的 VS Code 欢迎页扩展,提供环境信息展示、倒计时、文件漫游、仓库模版等功能。
| Command | Title |
|---|---|
cnb.welcome | CNB Welcome |
cnb.openTerminal | CNB: Open Terminal |
cnb.resetFirstRun | CNB: Reset First Run |
cnb.shutdownEnvironment | CNB: Shutdown Environment |
cnb.openRepoPage | CNB: Open Repo Page |
cnb.openVscode | CNB: Open VS Code Client |
| 层 | 技术 |
|---|---|
| Extension Host | TypeScript + reactive-vscode |
| Webview UI | Vue 3 + Vite 8 + Tailwind CSS v4 + shadcn-vue + Reka UI |
| 构建 | tsdown (ext host) + Vite (webview) |
| 测试 | Vitest |
├── src/ # Extension Host 源码
│ ├── commands/ # 命令注册
│ ├── shared/ # 与 webview 共享的类型与纯逻辑(messages / countdown / resourceFormat)
│ ├── statusbar/ # 状态栏:仓库标识与环境倒计时
│ ├── utils/ # 工具函数(env / api / webview / roaming / gitSafety / shutdownFlow 等)
│ └── views/ # Webview 面板(sidebar / welcome)
├── webview-ui/ # Webview 前端 (Vue 3 SPA)
│ └── src/
│ ├── assets/ # Tailwind v4 + shadcn 主题变量
│ ├── components/ # UI 组件(ui / welcome / sidebar)
│ ├── composables/ # 组合式函数(与 ext-host 消息桥接)
│ ├── dev/ # 浏览器开发态 mock 数据
│ ├── lib/ # 前端工具(cn / gitUrl / fileDisplay)
│ ├── types/ # 消息类型再导出(保留 @shared 别名屏蔽相对路径)
│ └── views/ # 顶层视图(WelcomeView / SidebarView)
├── test/ # Extension Host 单元测试
└── docs/ # 设计文档
# 安装依赖
pnpm install
# 开发 webview UI (HMR)
pnpm --filter webview-ui dev
# 构建
pnpm build
# 运行测试
pnpm test
# 打包 VSIX
pnpm pack
Apache-2.0 License © 2026-PRESENT wwvo