Lumitime

一个基于 Next.js 16 和 React 19 构建的现代化 Web 应用项目。

技术栈

  • 框架: Next.js 16.3.3 (App Router)
  • UI 库: React 19
  • 语言: TypeScript 5.7.3
  • 样式: Tailwind CSS v4
  • 组件库: shadcn/ui, Base UI
  • 动画: Motion (Framer Motion)
  • 包管理器: pnpm
  • 部署: PM2

项目结构

Lumitime/
├── app/                    # Next.js App Router 目录
│   ├── layout.tsx         # 根布局
│   ├── page.tsx           # 首页
│   └── globals.css        # 全局样式
├── components/            # 组件目录
│   ├── ui/               # UI 基础组件
│   └── discovery/        # 业务组件
├── lib/                  # 工具函数库
├── public/               # 静态资源
├── .next/                # Next.js 构建产物
└── node_modules/         # 依赖包

快速开始

环境要求

  • Node.js 18+
  • pnpm 8+

安装依赖

pnpm install

开发模式

pnpm dev

访问 http://localhost:3000 查看应用。

构建生产版本

pnpm build

启动生产服务器

pnpm start

主要依赖

核心依赖

  • next: Next.js 框架
  • react & react-dom: React 19
  • typescript: TypeScript 支持

UI 组件

  • @base-ui/react: 无障碍 UI 组件
  • shadcn: shadcn/ui 组件库
  • lucide-react: 图标库
  • motion: 动画库

样式工具

  • tailwindcss: Tailwind CSS v4
  • class-variance-authority: 组件变体管理
  • tailwind-merge: 样式类合并
  • clsx: 条件类名工具
  • tw-animate-css: Tailwind 动画扩展

分析

  • @vercel/analytics: Vercel 数据分析

配置文件

  • next.config.mjs: Next.js 配置
  • tsconfig.json: TypeScript 配置
  • components.json: shadcn/ui 组件配置
  • postcss.config.mjs: PostCSS 配置
  • pnpm-workspace.yaml: pnpm workspace 配置
  • ecosystem.config.cjs: PM2 进程管理配置

部署

项目使用 PM2 进行进程管理,可通过以下命令部署:

pm2 start ecosystem.config.cjs

开发规范

  • 使用 TypeScript 进行类型检查
  • 遵循 React 19 最佳实践
  • 使用 Next.js App Router 进行路由管理
  • 组件样式使用 Tailwind CSS
  • 代码格式化保持一致

License

Private


创建日期: 2026-09-11