Remix Vite + Drizzle + Cloudflare D1

📖 See the Remix docs and the Remix Vite docs for details on supported features.

D1

Create a new database named "db""

npx wrangler d1 create db

Paste the command output in wrangler.toml:

[[d1_databases]]
binding = "DB" # i.e. available in your Worker on env.DB
database_name = "db"
database_id = "ccccccvktlfkrjvvrngbckuvtrrkugtu"
# Also add this field
migrations_dir="./app/drizzle/migrations"

Add the drizzle migration

Generate types for your Cloudflare bindings in wrangler.toml. You will need to do this whenever you make changes to wrangler.toml.

npm run typegen

Running migrations

After making changes to the Drizzle schema, run the following command to generate a new migration file and apply it to your local database:

npm run db:migrate:local

Development

Run the Vite dev server:

npm run dev

To run Wrangler:

npm run build
npm run start

Deployment

Warning

Cloudflare does not use wrangler.toml to configure deployment bindings. You MUST configure deployment bindings manually in the Cloudflare dashboard.

First, build your app for production:

npm run build

Then, deploy your app to Cloudflare Pages:

npm run deploy