Prisma 连接 Mysql

remix 默认 使用 sqlite, 这里改为Mysql

修改 schema.prisma

generator client {
  provider = "prisma-client-js"
}

datasource db {
  provider = "mysql"
  url      = "mysql://root:123456@localhost:3306/jd_hexcal"
}

把 model 改为 真实的表结构
model Session {
  id            String    @id
  shop          String
  state         String
  isOnline      Boolean   @default(false)
  scope         String?
  expires       DateTime?
  accessToken   String
  userId        BigInt?
  firstName     String?
  lastName      String?
  email         String?
  accountOwner  Boolean   @default(false)
  locale        String?
  collaborator  Boolean?  @default(false)
  emailVerified Boolean?  @default(false)
}

理论上讲： prisma 是希望你先创建 schema 文件 然后迁移到真是的数据库

但是我觉得应该没人会这么做，肯定是用数据库工具建表后再导入进来，所以用下面的方法：

npx prisma db pull # 如果数据库已有表结构，这里可以反向生辰 schema 文件 npx prisma generate # 生成 Prisma Client

但是这里又产生了一个问题是：因为 prisma 的初始迁移

prisma migrate dev 是将 历史的 SQL 迁移记录 来重置到数据库，如果这是开发数据库 那么没问题，但是生产数据库则不行。 所以进行下面的步骤（Baselining a database）所谓基线化

1. 删除 migrations 目录
2. mkdir -p prisma/migrations/0_init
3. 使用 prisma migrate diff 生成迁移并将其保存到文件中 npx prisma migrate diff --from-empty --to-schema-datamodel prisma/schema.prisma --script > prisma/migrations/0_init/migration.sql
4. 为每个需要忽略的迁移运行 prisma migrate resolve 命令 npx prisma migrate resolve --applied 0_init

其实大部分时间内 我觉得都不需要这些复杂的功能，我只要一个正确的 匹配数据库的 schema 文件，然后运行 generate 命令即可使用 prisma

查看文档：关于如何通过所谓 baseLine 迁移 解决 已有数据库的问题

https://www.prisma.io/docs/orm/prisma-migrate/workflows/baselining

应该在mysql中也创建这个表，这个表用于app的session的保存.

这个 Session 表正是为了支持**多店铺（multi-tenant）**场景而设计的，你可以用它来将 App 发布到 Shopify App Store，并被多个商家同时使用，它满足所有必要条件. 实际做项目不一定需要这个表，或者说不需要那么全。具体的作用和代码还需要详细了解。

CREATE TABLE `Session` (
  `id` VARCHAR(191) NOT NULL PRIMARY KEY,
  `shop` VARCHAR(255) NOT NULL,
  `state` VARCHAR(255) NOT NULL,
  `isOnline` BOOLEAN NOT NULL DEFAULT FALSE,
  `scope` TEXT,
  `expires` DATETIME,
  `accessToken` TEXT NOT NULL,
  `userId` BIGINT,
  `firstName` VARCHAR(255),
  `lastName` VARCHAR(255),
  `email` VARCHAR(255),
  `accountOwner` BOOLEAN NOT NULL DEFAULT FALSE,
  `locale` VARCHAR(20),
  `collaborator` BOOLEAN DEFAULT FALSE,
  `emailVerified` BOOLEAN DEFAULT FALSE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

或者你也可以写好模型后执行迁移

npx prisma migrate dev --name init

✅ 创建共享 Prisma Client 实例

放在 app/db.server.js，避免热更新时多次实例化（Remix dev 模式下会热重启）

// app/db.server.js
import { PrismaClient } from "@prisma/client";

let db;

if (process.env.NODE_ENV === "production") {
  db = new PrismaClient();
} else {
  if (!global.__db) {
    global.__db = new PrismaClient();
  }
  db = global.__db;
}

export { db };

---

✅ 在 loader / action / server util 中使用 Prisma

示例 1：获取产品列表（loader）

// app/routes/products.jsx
import { json } from "@remix-run/node";
import { db } from "~/db.server";

export const loader = async () => {
  const products = await db.product.findMany();
  return json({ products });
};

示例 2：创建产品（action）

export const action = async ({ request }) => {
  const formData = await request.formData();
  const title = formData.get("title");

  if (typeof title !== "string" || title.length < 1) {
    return json({ error: "Invalid title" }, { status: 400 });
  }

  await db.product.create({ data: { title } });
  return json({ success: true });
};

---

✅ 客户端使用数据（React）

import { useLoaderData } from "@remix-run/react";

export default function ProductList() {
  const { products } = useLoaderData();

  return (
    <ul>
      {products.map(p => <li key={p.id}>{p.title}</li>)}
    </ul>
  );
}