3.7 KiB
3.7 KiB
PromptForge 安装和设置指南
系统要求
在开始之前，请确保您的系统满足以下要求：
- Node.js 18+ - 下载地址
- npm 或 yarn - 通常随Node.js一起安装
安装步骤
1. 安装 Node.js
访问 Node.js 官网 下载并安装最新的LTS版本。
安装完成后，验证安装：
node --version
npm --version
2. 克隆或下载项目
如果您有Git：
git clone <repository-url>
cd promptforge
或者直接下载项目文件到本地目录。
3. 安装依赖
在项目根目录下运行：
npm install
4. 启动开发服务器
npm run dev
应用将在 http://localhost:3000 启动。
项目结构
promptforge/
├── src/
│ ├── app/ # Next.js 页面
│ │ ├── page.tsx # 首页
│ │ ├── templates/ # 模板库
│ │ ├── editor/ # 编辑器
│ │ └── layout.tsx # 根布局
│ ├── components/ # React 组件
│ │ ├── editor/ # 编辑器组件
│ │ ├── layout/ # 布局组件
│ │ └── providers.tsx # 状态管理
│ ├── lib/ # 工具函数
│ ├── store/ # Zustand 状态
│ └── types/ # TypeScript 类型
├── package.json # 项目配置
├── tailwind.config.js # Tailwind 配置
├── tsconfig.json # TypeScript 配置
└── README.md # 项目说明
功能特性
✅ 已完成功能
-
完整的项目架构
- Next.js 14 + TypeScript
- Tailwind CSS 样式系统
- Zustand 状态管理
- 响应式设计
-
核心页面
- 首页：展示平台特色和精选模板
- 模板库：分类浏览、搜索、排序
- 编辑器：结构化提示词编辑
- 测试台：交互式测试界面
- 部署面板：代码生成
-
编辑器功能
- 结构化表单编辑
- 变量管理系统
- 约束条件管理
- 实时预览
- 代码生成
-
UI/UX 设计
- 深色模式优先
- 现代化界面
- 流畅动画
- 移动端适配
🚧 待完善功能
-
后端集成
- API 路由实现
- 数据库连接
- 用户认证
-
高级功能
- 真实的AI模型调用
- 批量测试功能
- 模板分享和社区
-
部署优化
- 生产环境配置
- 性能优化
- SEO 优化
开发指南
添加新功能
- 在
src/types/中定义类型 - 在
src/store/中添加状态管理 - 在
src/components/中创建组件 - 在
src/app/中添加页面路由
样式指南
- 使用 Tailwind CSS 类名
- 遵循设计系统规范
- 支持深色/浅色模式
- 确保响应式设计
代码规范
- 使用 TypeScript
- 遵循 ESLint 规则
- 编写清晰的注释
- 保持组件简洁
故障排除
常见问题
-
npm install 失败
- 检查 Node.js 版本
- 清除 npm 缓存：
npm cache clean --force - 删除 node_modules 重新安装
-
开发服务器启动失败
- 检查端口是否被占用
- 确认所有依赖已安装
- 查看控制台错误信息
-
样式不生效
- 确认 Tailwind CSS 配置正确
- 检查类名拼写
- 重启开发服务器
下一步计划
-
完善核心功能
- 实现真实的AI API调用
- 添加用户认证系统
- 完善模板管理功能
-
性能优化
- 代码分割和懒加载
- 图片优化
- 缓存策略
-
部署准备
- 生产环境配置
- CI/CD 流程
- 监控和分析
如有问题，请查看 README.md 或提交 Issue。