Next.js + Drizzle ORM 全流程终极指南
目录️ 全局架构逻辑图 (新增)前置准备依赖安装核心配置drizzle.config.ts (必填项检查)环境与安全.env 与 .gitignoreTypeScript 增强tsconfig.json 路径别名定义模型db/schema.ts (类型生成的源头)✨ 核心实战类型推导与数据插入 (含流程图)完整工作流验证常见问题与避坑指南1. ️ 全局架构 (新增)在写代码之前我们先看一张图理解Drizzle ORM是如何连接代码、配置和数据库的。 图解关键点左侧 (定义层)schema.ts是唯一的真理来源Single Source of Truth。它不仅定义表还通过$inferInsert自动生成了NewUser类型。中间 (配置层)drizzle.config.ts负责桥接它读取.env找到数据库并告诉工具去哪里找schema.ts。右侧 (执行层)CLI 工具根据配置生成 SQL 并更新数据库而你的业务代码则利用生成的NewUser类型确保传给数据库的数据是安全的。2. 前置准备依赖安装确保安装了运行时库、开发工具库以及类型定义。# 1. 核心运行时库npminstalldrizzle-orm postgres# 2. 开发工具库 (生成迁移用)npminstall-Ddrizzle-kit dotenv# 3. TypeScript 类型定义npminstall-Dtypes/node3. 核心配置drizzle.config.ts (必填项检查)此文件位于项目根目录。必须包含dotenv加载和环境变量校验。import{defineConfig}fromdrizzle-kit;import*asdotenvfromdotenv;// 【必填】加载 .envdotenv.config({path:.env});if(!process.env.DATABASE_URL){thrownewError(❌ 错误: .env 中缺少 DATABASE_URL);}exportdefaultdefineConfig({dialect:postgresql,dbCredentials:{url:process.env.DATABASE_URL!,// 非空断言},schema:./db/schema.ts,// ⚠️ 必须对应实际路径out:./drizzle,// 迁移文件输出目录verbose:true,strict:true,});4. 环境与安全.env 与 .gitignore.env文件DATABASE_URLpostgresql://postgres:你的密码localhost:5432/my_nextjs_db?schemapublic.gitignore文件确保包含.env .node_modules .next5. TypeScript 增强tsconfig.json 路径别名为了让导入更优雅如/db/schema配置paths。{compilerOptions:{baseUrl:.,paths:{/*:[./*],/db:[./db],/db/*:[./db/*]}}}6. 定义模型db/schema.ts (类型生成的源头)这是所有 TypeScript 类型的来源。文件路径:db/schema.tsimport{pgTable,text,serial,timestamp}fromdrizzle-orm/pg-core;exportconstuserspgTable(users,{id:serial(id).primaryKey(),// 自增主键name:text(name).notNull(),// 必填email:text(email).unique(),// 唯一createdAt:timestamp(created_at).defaultNow(),// 默认当前时间});// 显式导出类型// 1. 查询返回的类型 (全量字段)exporttypeUsertypeofusers.$inferSelect;// 2. 插入数据的类型 (自动排除自增和默认值字段)exporttypeNewUsertypeofusers.$inferInsert;7. ✨ 核心实战类型推导与数据插入 (含流程图)这一步展示了NewUser类型如何在代码中发挥作用。 类型推导微观流程PostgreSQL你的业务代码 (API)TypeScript 编译器db/schema.tsPostgreSQL你的业务代码 (API)TypeScript 编译器db/schema.ts推断结果:id? (可选)name (必填)email? (可选)createdAt? (可选)定义 id (serial), name (notNull), createdAt (default)运行 $inferInsert 推断逻辑const user: NewUser { ... }✅ 检查通过 (若只传 name, email)❌ 报错 (若漏传 name 或 多传 id)db.insert(users).values(user)成功写入 (id 和 createdAt 由数据库生成) 代码实战创建一个测试文件例如test-insert.tsimport{typeNewUser}from/db/schema;// ✅ 正确示范只需关注业务必填字段constnewUser:NewUser{name:Alice,email:aliceexample.com,// TS 智能提示id 和 createdAt 不需要传因为它们有默认值/自增};// ❌ 错误示范 1漏传必填字段 (TS 会红线报错)// const badUser1: NewUser { email: bobexample.com };// 报错信息: Property name is missing...// ❌ 错误示范 2传了不该传的字段 (TS 会红线报错)// const badUser2: NewUser { ..., id: 123 };// 报错信息: Object literal may only specify known properties, and id does not exist...console.log(✅ 类型检查通过数据准备就绪:,newUser);// --- 实际插入逻辑 ---// import { db } from /db;// import { users } from /db/schema;// await db.insert(users).values(newUser); 为什么这很重要编译期拦截在代码运行前TypeScript 就已经帮你挡掉了 90% 的数据库字段错误。智能提示输入newUser.时IDE 只会显示name和email界面清爽不再被id、updatedAt等系统字段干扰。重构友好如果数据库改了比如email变为必填所有使用该类型的地方都会立即报错提示你修改。8. 完整工作流验证结合图表逻辑跑通全流程生成迁移(读取 Config Schema - 生成 SQL):npx drizzle-kit generate执行迁移(执行 SQL - 更新 DB):npx drizzle-kit migrate类型检查(验证代码是否符合 Schema 类型):npx tsc--noEmit✅ 无报错 类型安全通关运行测试:npx tsx test-insert.ts9. 常见问题与避坑指南问题原因解决方案Cannot find module /db/schemaTS 路径未生效检查tsconfig.json重启 VS Code TS 服务。Property id is missing误用了$inferSelect插入用$inferInsert(NewUser)查询用$inferSelect(User)。process.env.DATABASE_URL is undefinedconfig 文件没加载 env确保drizzle.config.ts顶部有dotenv.config()。TS 提示id不是可选的Schema 定义问题检查id是否加了.primaryKey()Drizzle 依赖此标记来推断可选性。10. 核心概念解析在开始动手之前我们需要明确今天涉及的四个关键角色及其关系组件角色比喻作用PostgreSQL Server仓库管理员真正存储数据的地方。它是一个后台服务负责接收指令、保存数据、保证数据安全。pgAdmin 4仓库可视化大屏图形化管理工具。让你不用敲黑底白字的命令通过点击鼠标就能查看表结构、浏览数据、执行 SQL。Drizzle ORM翻译官/中介位于你的 Next.js 代码和数据库之间。你写的是 TypeScript/JavaScript 代码Drizzle 把它“翻译”成数据库能听懂的 SQL 语句。.env文件门禁卡/钥匙存储敏感信息如数据库密码、连接地址。绝对不能上传到 GitHub是连接代码与数据库的唯一凭证。11. 环境准备与安装流程 (Windows 版2. 环境准备与安装流程 (Windows 版)2.1 下载官方安装包我们采用“一站式”安装策略一个安装包同时解决数据库和管理工具。下载地址PostgreSQL Windows Installer选择版本推荐下载最新的稳定版如 PostgreSQL 17 或 16架构选择Windows x86-64。2.2 安装向导关键步骤详解双击.exe文件后请严格遵循以下设置安装目录保持默认 (C:\Program Files\PostgreSQL\xx)。组件选择 (Select Components)⚠️关键点✅PostgreSQL Server(必选)✅pgAdmin 4(必选用于可视化操作)✅Command Line Tools(必选用于命令行调试)❌Stack Builder(安装完成后弹出的额外窗口直接关闭或选 No无需安装)设置超级用户密码 (Superuser Password)最重要用户名默认为postgres。密码设置一个你记得住的密码开发环境可用123456生产环境必须复杂。注意这个密码将用于.env配置和 pgAdmin 登录。端口 (Port)保持默认5432。区域 (Locale)保持默认Default locale。 总结通过这张架构逻辑图和类型推导流程我们清晰地看到了单一事实来源schema.ts定义了结构也定义了类型。自动化魔法$inferInsert自动过滤掉系统字段让你只关心业务数据。全链路安全从配置文件的路径检查到 TypeScript 的编译时校验再到数据库的最终写入每一层都有保护。现在你不仅拥有了一个可运行的环境更掌握了一套类型驱动开发 (Type-Driven Development)的最佳实践。去构建你的应用吧
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2449319.html
如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!