RemixでPrismaを後から追加する

Remixプロジェクトで、セットアップ時にPrismaが入っていないケースがある様子でした。

たぶん、テンプレート次第なのかもしれません。

必要なライブラリを追加する

「やっぱりPrisma入れたい」となった場合、ライブラリを２つ追加しましょう。

% npm i @prisma/client
% npm i -D prisma

その後、セットアップコマンドを実行します。

npx prisma init --datasource-provider sqlite

Prisma / DBの設定をする

prisma/schema.prismaが生成されますので、DBやスキーマの設定をしましょう。

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

datasource db {
  provider = "sqlite"
  url      = "file:../.wrangler/state/d1/DB.sqlite3"
}

model Post {
  slug     String @id
  title    String
  content  String

  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
}

設定を変更した場合は、migrateを実行します。

% npx prisma migrate dev  --name init
Prisma schema loaded from prisma/schema.prisma
Datasource "db": SQLite database "DB.sqlite3" at "file:./.wrangler/state/d1/DB.sqlite3"

SQLite database DB.sqlite3 created at file:./.wrangler/state/d1/DB.sqlite3

Applying migration `20230311124533_init`

The following migration(s) have been created and applied from new schema changes:

migrations/
  └─ 20230311124533_init/
    └─ migration.sql

Your database is now in sync with your schema.

あとはRemixプロジェクト内で、Prismaを使った処理を実装しましょう。