Supabaseで作ったDBのTypeScript用型設定を自動生成する方法

はじめに

Supabaseで作ったDBのTypeScript用型設定を自動生成する方法です。

方法

インストール～型情報の出力まで

# Supabase CLIインストール
$ npm install supabase

# ログイン
# TOEKNはDashboard > Access Tokens > Generate new tokenで作成
$ npx npx supabase login --token <TOKEN>

# 初期化 -> /supabaseフォルダが作成される
$ npx supabase init

# プロジェクトとリンクさせる
# Project Settings > General > General settings > Reference ID
$ npx supabase link --project-ref プロジェクトのReference ID

# 型情報を/schema.tsに出力
$ npx supabase gen types typescript --linked > schema.ts

createClientでの使い方

import { createClient } from "@supabase/supabase-js";
import type { Database } from "./schema";

export const supabase = createClient<Database>(
    "PUBLIC_SUPABASE_URL",
    "PUBLIC_SUPABASE_ANON_KEY"
);