JadePack

JadePack 是一个现代化的 React 项目，使用 TypeScript、Vite 和 Tailwind CSS 构建，提供了完整的构建控制台界面。

项目架构

技术栈

• 前端框架: React 19.2.0
• 语言: TypeScript 5.9.3
• 构建工具: Vite 8.0.0-beta.13
• 包管理器: Bun

项目结构

src/
├── components/          # 可复用组件
│   ├── Dropdown.tsx     # 下拉菜单组件
│   ├── Header.tsx       # 头部组件
│   ├── NavItem.tsx      # 导航项组件
│   ├── NewProjectModal.tsx  # 新建项目模态框
│   ├── Sidebar.tsx      # 侧边栏组件
│   └── TableComponent.tsx   # 表格组件
├── pages/               # 页面组件
│   ├── Builds.tsx       # 构建页面
│   ├── Certificates.tsx # 证书管理页面
│   ├── Dashboard.tsx    # 仪表盘页面
│   ├── History.tsx      # 构建历史页面
│   ├── Login.tsx        # 登录页面
│   └── Settings.tsx     # 设置页面
├── App.tsx              # 应用主组件
├── index.css            # 全局样式
└── main.tsx             # 应用入口

核心功能

1. 用户认证: 登录/登出功能
2. 仪表盘: 系统信息展示、构建概览
3. 构建管理: 查看和管理构建任务
4. 构建历史: 查看历史构建记录
5. 证书管理: 管理构建证书
6. 系统设置: 主题设置等
7. 响应式设计: 适配不同屏幕尺寸

使用 Bun 管理项目

安装 Bun

如果还没有安装 Bun，请按照以下步骤安装：

# Windows
powershell -c "iwr https://bun.sh/install.ps1 -useb | iex"

# macOS/Linux
curl -fsSL https://bun.sh/install | bash

项目依赖管理

安装依赖

bun install

添加依赖

bun add <package-name>

移除依赖

bun remove <package-name>

更新依赖

bun update

运行项目

开发模式

bun run dev

项目将在 http://localhost:5173 启动。

构建项目

bun run build

构建产物将输出到 dist 目录。

预览构建结果

bun run preview

代码检查

bun run lint

项目特点

1. 现代化技术栈: 使用最新的 React 19、TypeScript、Vite 等技术
2. 完整的登录系统: 包含登录页面和登出功能
3. 响应式设计: 适配不同屏幕尺寸
4. 动画效果: 使用 Framer Motion 实现流畅的动画效果
5. 主题切换: 支持深色/浅色主题切换
6. 表格组件: 可复用的表格组件，支持排序和筛选
7. 下拉菜单: 可复用的下拉菜单组件
8. 系统信息展示: 展示系统信息和构建概览

登录信息

演示账号：

• 邮箱: admin@jade.io
• 密码: password123

许可证

MIT