skelet/intro/wasp-lang-open-saas.txt

项目名称:Wasp Open SaaS

github:https://github.com/wasp-lang/open-saas
简介:免费完整的 JavaScript SaaS 基础设施，由 Wasp 框架驱动，集成 React 前端和 Node.js 后端，强调全栈类型安全。星数最高（14800+）的开源 SaaS 骨架，特别为 AI coding 和 Cursor/Claude Code 优化，是 AI 友好度最高的选择。

语言:JavaScript,TypeScript,React,Node.js

场景:全栈 SaaS、AI 应用、快速启动、团队协作、AI coding 深度开发

6项评分:5,5,4,5,3,5

推荐理由:星数最高、AI 友好度最高的官方项目。Wasp 框架的结构化设计和完整示例特别适合 AI 代码生成。支持 Claude Code 和 Cursor 等 AI 工具，是最适合 AI coding 深度开发的选择。类型安全覆盖全栈，文档优秀，一键部署。

下载:https://github.com/wasp-lang/open-saas

文章1标题:Wasp Open SaaS：AI Coding 时代最友好的全栈 SaaS 骨架

文章1内容:

一、项目定位
Wasp Open SaaS 是由 Wasp 框架驱动的完整 SaaS 基础设施。
不同于传统 Next.js 或 Express，Wasp 是一种新范式：
用声明式语言描述应用的「骨架」（路由、操作、查询），
自动生成类型安全的前后端代码。
这使得整个应用的代码更少、类型更强、AI 更易理解。

特别对 Claude Code、Cursor 等 AI coding 工具做了优化，
官方文档明确支持 AI 辅助开发。

二、核心功能
• 🔐 全栈认证系统
  - 邮箱/密码注册登录
  - 社交登录（Google、GitHub、Keycloak）
  - 多因素认证支持
• 📧 邮件发送
  - SendGrid、Mailgun、SMTP 支持
  - 邮件模板系统
• 💾 文件上传
  - AWS S3 集成
  - 本地文件存储选项
• 💳 支付集成
  - Stripe、Polar.sh、Lemon Squeezy
  - 一键设置订阅
• 🤖 AI 集成
  - OpenAI API 预制
  - LLM 友好的 API 设计
• 🚀 一键部署
  - Railway、Fly.io、Heroku 支持
  - 自动 SSL 和域名配置

三、技术栈
部分                技术
全栈框架            Wasp 框架
前端                React + TypeScript
后端                Node.js + Express
数据库              PostgreSQL
ORM                 Prisma ORM
样式                Tailwind CSS + shadcn/ui
认证                Wasp Auth（内置）
支付                Stripe/Polar/Lemon Squeezy
邮件                SendGrid/Mailgun/SMTP

四、快速开始
# 安装 Wasp CLI
npm install -g wasp-lang

# 克隆 Open SaaS
git clone https://github.com/wasp-lang/open-saas.git
cd open-saas

# 安装依赖
npm install

# 配置环境（复制示例）
cp .env.example .env

# 启动开发服务器
wasp start

# 后台任务队列（如需）
npm run dev:db:studio

五、AI Coding 友好度评分

维度          分值  说明
目录结构      5/5   Wasp 框架的声明式设计天然清晰
文档完整度    5/5   官方文档详细，有大量示例
测试覆盖      4/5   有测试框架支持，示例完整
示例模块      5/5   完整的认证、支付、邮件示例
依赖克制度    3/5   Wasp 生态依赖多，但易于管理
增量开发      5/5   框架结构化，特别适合 AI 生成代码

总体评分: 88/100 (最适合 AI coding 深度开发)

六、为什么选择 Wasp Open SaaS

1. 官方优化，明确支持 AI coding（如 Claude Code、Cursor）
2. 全栈类型安全，从数据库到 UI 一致
3. 星数最高（14800+），社区最活跃
4. Wasp 框架的「声明式」设计，AI 最易理解代码生成逻辑
5. 完整示例（认证、支付、邮件、AI），复用率高
6. 后台任务、WebSocket、文件上传等高级功能完整
7. 一键部署到 Railway/Fly.io，不费事

七、不适合的场景

• 团队不熟悉新框架（Wasp）的学习成本较高
• 需要与现有 Express/Next.js 项目集成
• 极简主义者（依赖多、学习曲线陡）
• 追求最小化依赖的项目

文章2标题:使用 Claude Code + Wasp Open SaaS 快速构建 AI 应用

文章2内容:

一、为什么 Wasp + AI Coding 是绝配

Wasp 框架的设计理念与 AI coding 的需求天然贴切：

1. **声明式编程** = AI 易于理解的代码结构
   - 传统 Express：200 行路由配置
   - Wasp：10 行声明式 API 定义

2. **类型安全贯穿全栈** = AI 生成代码的正确性保证
   - 从 Prisma schema → Wasp operations → TypeScript types → React hooks
   - 每一层都有类型检查，AI 改错概率低

3. **预置集成** = AI 不需要自己设计
   - 认证、支付、邮件、文件都有标准模式
   - AI 只需填充业务逻辑，不需造轮子

4. **官方示例完整** = AI 有明确参考
   - 每个功能都有工作示例代码
   - AI 可以直接模仿模式，准确率高

二、快速上手流程

**第 1 天：项目启动**
```bash
# 1. 创建 Wasp 项目
wasp new my-saas-app
cd my-saas-app

# 2. 启动开发服务器
wasp start

# 3. 打开 Claude Code / Cursor
#   - 询问 AI：「基于这个 Wasp 项目，帮我创建一个文章管理系统」
#   - AI 会自动：
#     - 修改 wasp/Main.wasp（定义 entity 和 queries/actions）
#     - 生成 src/client/ 页面（React 组件）
#     - 生成 src/server/ 业务逻辑
#     - 类型自动同步
```

**第 2-3 天：核心功能**
- 用户认证（Wasp 内置，开箱即用）
- 数据模型（修改 schema.prisma，wasp start 自动迁移）
- CRUD 页面（AI 可快速生成）

**第 4-5 天：支付集成**
```wasp
action stripe {
  fn: import { stripePayment } from "@/actions/stripe.js",
}
```
AI 看到这个声明就知道怎么实现支付流程。

**第 6-7 天：部署**
```bash
wasp build
cd build
fly deploy  # 一键部署到 Fly.io
```

三、AI Coding 工作流示例

**场景：添加「博客文章管理系统」**

🔴 传统方式（Express + React）：
- 你告诉 AI：「要一个博客 CRUD API」
- AI 需要理解 10 个文件的关系，可能出错
- 你修改，AI 重新生成，反复来回

🟢 Wasp 方式：
```wasp
entity Article {=psl
  id                  Int             @id @default(autoincrement())
  title               String
  content             String
  author              User            @relation(fields: [authorId], references: [id])
  authorId            Int
  createdAt           DateTime        @default(now())
psl=}

query getAllArticles {
  fn: import { getAllArticles } from "@/queries/articles.js",
}

action createArticle {
  fn: import { createArticle } from "@/actions/articles.js",
}
```

你告诉 AI：「根据这个 Wasp 定义实现博客 CRUD」
AI 一次生成正确的：
- 数据库 schema（自动执行迁移）
- 后端 query/action（类型安全）
- React 页面和 hooks（自动连接到后端）

**为什么不出错？**
- 类型系统贯穿全栈
- 框架的声明式设计消除歧义
- AI 看 Wasp 文件就知道「业务模型」，不需要猜测

四、部署指南（一键上线）

```bash
# 1. 连接 Railway 或 Fly.io 账号
wasp deploy fly create

# 2. 配置环境变量（PostgreSQL 自动创建）
# 3. 一键部署
wasp deploy fly deploy

# 完成！你的 SaaS 已上线，包括：
# - 自动 HTTPS
# - PostgreSQL 数据库
# - Node.js 后端
# - React 前端
```

五、何时用 Wasp vs 其他框架

| 场景 | Wasp | Next.js | boxyhq |
|------|------|---------|--------|
| AI coding 快速迭代 | ✅⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐ |
| 学习成本 | 中等 | 最低 | 较高 |
| 企业级功能 | ✅ | 需自建 | ✅ |
| 团队规模 | 小-中 | 任何 | 中-大 |
| 一键部署 | ✅ | ❌ | ❌ |
| AI Coding 优化 | ✅⭐⭐⭐⭐⭐ | ✅ | - |
| 全栈类型安全 | ✅ | ✅ | ✅ |

**结论：**
如果你用 Claude Code / Cursor 做 AI coding，Wasp Open SaaS 是目前最匹配的选择。