网站网页设计项目计划书宁波seo在线优化哪家好
使用 Cloudflare D1 和 Drizzle ORM 将后端添加到 Astro 项目的分步指南
文章目录
- 安装 Astro
- 添加 Cloudflare 适配器
- 部署到 Pages
- 安装 wrangler 并登录
- 创建 D1 数据库
- 创建 wrangler.toml 文件
- 将 .wrangler 添加到 .gitignore
- 更新 astro.config.ts
- 安装 Drizzle 依赖项
- 创建 drizzle.config.ts
- 创建您的架构
- 将脚本添加到 package.json
- 生成 migrations
- 在本地应用迁移
- 使用 Drizzle Studio 与本地数据库交互
- 将数据库添加到本地
- 渲染链接
- 在 Pages 项目中添加绑定
- 运行预览版和生产版的迁移
- 将数据添加到预览和生产环境
- 就这样！
安装 Astro
这非常简单——运行以下命令：
npm create astro@latest
- 选择 Empty 作为模板
- 选择使用最严格的 TypeScript
- 默认值对其他一切都很好
然后您可以 cd 进入您的项目并运行 npm run dev
添加 Cloudflare 适配器
在您的项目中，您现在可以运行：
npx astro add cloudflare
对所有事情说“是”，然后提交所有内容并将其推送到 Github。
部署到 Pages
前往创建 Pages应用程序，然后单击“连接到 git”以创建页面
使用 Github 存储库的应用程序。
请务必选择 Astro Framework 预设！
安装 wrangler 并登录
如果您尚未执行此操作，请安装 wrangler 并通过运行以下命令登录：
npm i -g wrangler
wrangler login
创建 D1 数据库
我们将创建两个数据库，一个用于生产，一个用于预览版本。
为此，请运行以下命令：
wrangler d1 create d1-demo-prod-db
wrangler d1 create d1-demo-preview-db
创建 wrangler.toml 文件
我们需要一个 wrangler.toml 文件，其中包含我们刚刚创建每个数据库中的 database_id
# wrangler.toml
node_compat = true[[d1_databases]]
binding = "DB"
database_name = "d1-demo-prod-db"
database_id = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
preview_database_id = "DB"[env.preview]
name = "preview"
[[env.preview.d1_databases]]
binding = "DB"
database_name = "d1-demo-preview-db"
database_id = "yyyyyyyy-yyyy-yyyy-yyyy-yyyyyyyyyyyy"
将 .wrangler 添加到 .gitignore
echo .wrangler >> .gitignore
更新 astro.config.ts
我们需要像这样添加 D1 绑定：
// astro.config.ts
import { defineConfig } from "astro/config";import cloudflare from "@astrojs/cloudflare";// https://astro.build/config
export default defineConfig({output: "server",adapter: cloudflare({runtime: {mode: "local",type: "pages",bindings: {DB: {type: "d1",},},},}),
});
安装 Drizzle 依赖项
运行以下命令：
npm i drizzle-orm
npm i -D better-sqlite3 drizzle-kit cross-env @types/node
创建 drizzle.config.ts
这就是我们的 drizzle.config.ts 文件的样子：
// drizzle.config.ts
import type { Config } from "drizzle-kit";const {