mcpField
B
blink-full-stack

blink-full-stack

github.com/blink-new开发439 次安装2 周前更新
代码仓库

关于 blink-full-stack

逐步介绍使用 Blink 构建和部署全栈应用的指南，面向启动或管理 Blink 项目的开发者，将项目设置、身份验证、数据、后端、部署和项目上下文串联为工作流。

主要功能

  1. 01创建项目并初始化 SDK
  2. 02配置身份验证和数据库访问
  3. 03构建并部署后端
  4. 04部署应用并配置域名
  5. 05记录供 Agent 使用的项目上下文

适用场景

  1. 01从项目设置开始创建 Blink 应用
  2. 02添加身份验证和数据库操作
  3. 03部署应用并连接自定义域名
  4. 04记录项目设置以供后续 Agent 会话使用

MCP 相关

指南提及用于创建 Blink 项目和获取其 publishable key 的 MCP 工具。

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/blink-new/blink-plugin --skill blink-full-stack

安装后在 Claude Code 中输入/blink-full-stack确认已加载。

详细介绍

前置条件

构建前，请确保已安装并完成 Blink CLI 身份验证：

npm install -g @blinkdotnew/cli
blink login

如果尚未安装 blink，请先运行安装命令。blink login 会打开浏览器以创建工作区 API 密钥，按照提示操作后，凭据会保存到本地。

概述

这是从零开始构建完整全栈 Blink 应用并将其部署到生产环境的主指南。每个章节都链接到更深入的技能指南。

步骤 1 — 项目设置

# Install SDK in your app directory
bun add @blinkdotnew/sdk

或者使用 MCP 工具：

  1. blink_project_create — 创建项目并返回 id
  2. blink_project_keys — 返回 publishableKey（blnk_pk_...）— 请在创建项目后调用

步骤 2 — SDK 初始化

import { createClient } from '@blinkdotnew/sdk'

export const blink = createClient({
  projectId: process.env.NEXT_PUBLIC_BLINK_PROJECT_ID || 'your-project-id',
  publishableKey: process.env.NEXT_PUBLIC_BLINK_PUBLISHABLE_KEY || 'blnk_pk_xxx',
  auth: { mode: 'managed' },
})

各框架的环境变量前缀：NEXT_PUBLIC_（Next.js）、VITE_（Vite）、EXPO_PUBLIC_（Expo）。

为什么需要备用值？ 如果环境变量未定义，SDK 会静默失败，导致应用卡住。

步骤 3 — 身份验证

blink.auth.login()  // managed mode — redirects to hosted auth
// OR headless mode for custom UI:
await blink.auth.signInWithEmail(email, password)

→ 完整详情：请参阅 blink-auth 技能指南

步骤 4 — 数据库

# Create tables via CLI
blink db query "CREATE TABLE todos (id TEXT PRIMARY KEY, title TEXT NOT NULL, user_id TEXT, is_completed INTEGER DEFAULT 0, created_at TEXT DEFAULT (datetime('now')))"

const todos = await blink.db.todos.list({
  where: { userId: user.id },
  orderBy: { createdAt: 'desc' },
})

→ 完整详情：请参阅 blink-database 技能指南

步骤 5 — 后端（Pro+）

编写 backend/index.ts，使用 Hono 服务处理 Webhook、密钥和服务端逻辑。

blink backend deploy

→ 完整详情：请参阅 blink-backend 技能指南

步骤 6 — 部署

npm run build
# Always pass project ID explicitly
blink deploy <project_id> ./dist --prod
# → site is live immediately at https://{project_slug}.blinkpowered.com
# The CLI prints the URL. Do NOT call blink_hosting_activate after this.

请勿调用 blink_hosting_activate — 对于在外部构建的应用，它会用 Blink AI 模板覆盖你的文件。

→ 完整详情：请参阅 blink-deploy 技能指南

步骤 7 — 保存项目上下文

部署后，请在项目根目录编写 AGENTS.md，并使用本次会话中的实际值 — 真实项目 ID、真实可发布密钥、真实线上 URL、真实 SQL。请勿使用 {project_id} 之类的占位符。

# Blink Project

## Project
- **ID**: `actual-project-id-here`
- **Live URL**: `https://actual-project-id.blinkpowered.com`
- **Publishable Key**: `blnk_pk_actualKeyHere`

## Deploy
npm run build && blink deploy actual-project-id ./dist --prod

## Database
CREATE TABLE tasks (id TEXT PRIMARY KEY, title TEXT NOT NULL, ...)

## Auth: headless (or managed)

还要编写 CLAUDE.md：

# Claude Context
@AGENTS.md

→ 有了这些文件，任何打开此目录的 Agent 都能立即了解 Blink 设置 — 项目 ID、密钥、架构、部署命令 — 无需再次提示。

步骤 8 — 自定义域名

blink domains add myapp.com
# Follow DNS instructions from output
blink domains verify myapp.com

→ 完整详情：请参阅 blink-domains 技能指南

关键规则

  1. SDK 代码中全部使用 camelCase — userId、createdAt（会自动转换为 snake_case）
  2. SQLite 中的布尔值是 "0"/"1" 字符串 — 使用 Number(val) > 0
  3. ID 是字符串，绝不是数字 — 格式为 "todo_abc123"
  4. 大多数 SDK 模块都需要身份验证 — 请在调用数据库/存储功能前设置身份验证

技能索引

技能使用场景
blink-auth登录、注册、社交身份提供商、RBAC
blink-databaseCRUD 操作、筛选、原始 SQL
blink-storage文件上传、下载、管理
blink-backendWebhook、服务端密钥、自定义 API
blink-queue后台任务、定时任务
blink-deploy构建并部署到生产环境
blink-domains自定义域名、DNS、SSL
blink-ai文本/图像/视频生成、TTS、转录、AI 调用
blink-agents托管式 AI Agent 服务（Blink Claw）
blink-connectorsOAuth 集成（Slack、Google、Notion、38+ 项服务）
blink-rag知识库、向量搜索、带引用的 AI 问答
blink-realtimeWebSocket 发布/订阅、在线状态、消息历史
blink-notifications电子邮件、短信、电话号码

支持的框架

前端：React（Vite）、Next.js（静态导出）、Vue、Svelte、Astro、Expo React Native、纯 HTML/CSS/JS

后端：仅支持 TypeScript/JavaScript（CF Workers 上的 Hono）

评论

支持 Markdown