Generating TypeScript Types from Supabase for Type-Safe Apps

When working with Supabase and TypeScript, keeping your types in sync with your database is essential for type safety. Here’s a simple 2-step guide to generate types from your Supabase project.

Step 1: Get Your Supabase Access Token

1. Go to your Supabase Dashboard.
2. Click on your profile icon (top right) and select Account.
3. Scroll down to Access Tokens.
4. Click Generate New Token, give it a name (e.g., "typegen"), and copy the generated token.

Step 2: Generate Types Using the Supabase CLI

1. Open your terminal.
2. Log in with your access token:

supabase login --token YOUR_PASTED_TOKEN

3. Generate the types (replace "projectid" with your actual project ref):

npx supabase gen types typescript --project-id **projectid** > lib/database.types.ts --debug

4. Additionally you can write a script in package.json.

{
  "scripts": {
    "generate-types": "npx supabase gen types typescript --project-id **projectid** > lib/database.types.ts --debug"
  }
}

Conclusion:
That’s it! You now have up-to-date TypeScript types for your Supabase schema. Use these types in your app for a safer and smoother development experience.