快速开始

本文档将指导您如何快速设置开发环境并运行斐流艺创项目。

前置要求

在开始之前，请确保您的开发环境满足以下要求：

Node.js 版本

项目需要 Node.js 版本 >= 22.x

# 检查 Node.js 版本
node --version

包管理器

项目使用 pnpm 作为包管理器，需要版本 >= 9.11.0

# 检查 pnpm 版本
pnpm --version

如果您尚未安装 pnpm，可以通过以下命令安装：

# 通过 npm 安装 pnpm
npm install -g pnpm

项目初始化

1. 克隆项目

# 克隆项目代码
git clone https://github.com/iflux-art/official.git

# 进入项目目录
cd official

2. 安装依赖

# 安装项目依赖
pnpm install

3. 环境变量配置

项目需要配置一些环境变量才能正常运行。请复制 .env.example 文件并重命名为 .env.local，然后根据需要修改配置：

# 复制环境变量文件
cp .env.example .env.local

打开 .env.local 文件并配置必要的环境变量：

# Clerk 认证配置
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
CLERK_SECRET_KEY=your_clerk_secret_key

# 网站配置
NEXT_PUBLIC_SITE_URL=https://your-site-url.com

开发环境运行

启动开发服务器

# 启动开发服务器
pnpm dev

默认情况下，开发服务器将在 http://localhost:3000 上运行。

构建生产版本

# 构建生产版本
pnpm build

启动生产服务器

# 启动生产服务器
pnpm start

项目结构概览

了解项目结构有助于您快速上手开发：

.
├── src/
│   ├── app/ - Next.js 应用路由
│   ├── components/ - 共享UI组件
│   ├── content/ - 内容数据（MDX、JSON）
│   ├── features/ - 功能模块（高内聚）
│   ├── lib/ - 工具函数
│   ├── middleware.ts - 中间件
│   └── styles/ - 全局样式
├── public/ - 静态资源
├── next.config.mjs - Next.js 配置
└── tailwind.config.mjs - Tailwind 配置

常用命令

项目提供了丰富的 npm scripts 来帮助您进行开发：

命令	描述
pnpm dev	启动开发服务器（使用Turbopack）
pnpm build	构建生产版本
pnpm start	启动生产服务器
pnpm lint	运行代码检查
pnpm lint:fix	自动修复代码问题
pnpm format	格式化代码
pnpm format:check	检查代码格式
pnpm check	运行代码检查和格式化
pnpm check:fix	自动修复代码检查和格式化问题
pnpm type-check	运行TypeScript类型检查
pnpm test	运行测试
pnpm test:run	运行测试一次
pnpm test:coverage	生成测试覆盖率报告
pnpm preview	构建并预览生产版本
pnpm clean	清理构建文件
pnpm update-deps	更新依赖包
pnpm update-deps:latest	更新所有依赖到最新版本

下一步

现在您已经成功设置了开发环境，可以：

1. 阅读技术栈与依赖文档了解项目使用的技术
2. 查看核心功能模块文档了解项目功能
3. 阅读开发规范文档了解编码规范
4. 查看贡献指南了解如何参与项目开发

如果您在设置过程中遇到任何问题，请查看常见问题解答或在 GitHub 上提交 Issue。