Ability to Generate Typescript Type Definitions from Server Schema

[Marviel]

Same as https://github.com/supabase/realtime-js/issues/153

Feature request

As a client, I would like to generate typescript definitions for my supabase realtime client -- call it the Typed-SDK -- based on the current schema in my postgres database.

I would also like to have the option to be notified when the types I am trying to use are "out of date" with the database's current schema types.

Describe the solution you'd like

• I believe in order for this to work, there would need to be some type of CLI command. Similar to how Graphql Codegen handles this.
• These types could get out of date with the schema in the database, so I would like to have the ability to get (disable-able) warnings whenever my current typed-SDK is out of sync with the server. I believe this could be done by a command which would get the hash of the current (Public) schema.

Additional context

• Graphql Codegen does a good job of this.

[prescience-data]

This would be super nice to have in the Supabase CLI, which incidentally appears to be on the roadmap already.

Would be great to also have the codegen feature set built in automatically to the cli as well.

[sweatybridge]

Although not perfect, cli v1 does support type generation for tables. https://supabase.com/docs/reference/cli/usage#supabase-gen

If you encounter any issues with type gen, please don’t hesitate to open another issue. We will look into it asap.

[RyanTippsTX]

@sweatybridge does this only work if self-hosting Supabase?

[sweatybridge]

Hi @RyanTippsTX , the CLI supports typegen for Supabase hosted project.

supabase gen types typescript --db-url <your_project_url>

You can obtain the url from your project dashboard -> database tab.

[RyanTippsTX]

can i do this without a toml file & linking?

[sweatybridge]

Currently you can do this without linking but supabase init is required to create the toml file. It also starts a docker container for generating types.

[RyanTippsTX]

Thank you

[bennik88]

I don't understand how to generate the typescript types by reading the documentation. I've come so far by watching your new Supabase Launch Week videos. But they also skip the part on how to do it with --db-url. I'm having the CLI installed and I've used $supabase login so I'm now logged in. But when trying $supabase gen types typescript --db-url https://myurl.supabase.co it says $Error: Missing config: open supabase/config.toml: no such file or directory (When using supabase init and then try to generate the types, I get the error Error: URL is not a valid Supabase connection string.). How can I overcome this. I also tried to use the database string postgresql://postgres:[email protected]:5432/postgres

[RyanTippsTX]

@bennik88 try using postgres://postgres:[email protected]:6543/postgres (note the lack of "sql" at the beginning, and the different port number at the end)

Overall, for @bennik88 or for anyone else, i was able to generate types doing the following:

from your terminal: brew install supabase/tap/supabase then cd into your project directory supabase login supabase init this creates supabase/config.toml

Then download docker if you don't already have it (easiest way is directly from their site, or you can use brew), and then let it run. You dont need to do anything else in docker or be familiar with docker.

back in terminal: supabase start this will start running a docker container, which is why docker needs to be running

And finally supabase gen types typescript --db-url postgres://postgres:[YOUR-PASSWORD]@db.[your-project-string].supabase.co:6543/postgres > lib/database.types.ts ^Note, make sure your connection string starts with “postgres” not “postgresql”, and the port should be 6543 not 5432. This is listed at the very bottom of my supabase > settings > database page.

Then in your javascript files, you can do something like this:

import { Database } from '../lib/database.types';
type Car = Database['public']['Tables']['cars']['Row'];

After you generate the types, you can delete the supabase directory & the toml file, or add the directory to your gitignore, or just add it to your version control. If you delete it, you will have to re-init when you want to generate types in the future when you inevitably modify your db schema.

[soedirgo]

can i do this without a toml file & linking?

Just an update: you can now generate types without init/linking/etc. - all you need to do is to login with your access token:

supabase login
supabase projects list
supabase gen types typescript --project-id abcdefghijkl

[abhay187]

can i do this without a toml file & linking?

Just an update: you can now generate types without init/linking/etc. - all you need to do is to login with your access token:

supabase login
supabase projects list
supabase gen types typescript --project-id abcdefghijkl

This works, but why this is not mentioned in the docs? I tried openapi-typescript which did not work. Also, how to output it to a file?

[RyanTippsTX]

Also, how to output it to a file?

@abhay187 You can use Output Redirection in your shell command, for example:

supabase gen types typescript --project-id abcdefghijkl > lib/database.types.ts

[soedirgo]

We're working on an updated docs for TypeScript support. openapi-typescript isn't compatible with supabase-js v2.

[Dal-Tron]

Hey, I'm using supabase: 1.12.2 and when I run the command above, I get an error: Error: unknown flag: --project-id

[abhagsain]

Hey, I'm using supabase: 1.12.2 and when I run the command above, I get an error: Error: unknown flag: --project-id

I also got the same error then I upgraded to v1.14.3 and it worked. I had installed it with brew so brew upgrade supabase

supabase gen types typescript --project-id your-project-id> app/types/supabase.ts

Please note that the autocomplete might not show project-id but the command works.

[Dal-Tron]

@abhagsain Thanks, that was it!

[planktonrobo]

Hey, I'm using supabase: 1.12.2 and when I run the command above, I get an error: Error: unknown flag: --project-id

I also got the same error then I upgraded to v1.14.3 and it worked. I had installed it with brew so brew upgrade supabase

supabase gen types typescript --project-id your-project-id> app/types/supabase.ts

Please note that the autocomplete might not show project-id but the command works.

Should add this to docs

[Aladdin4u]

I ran npx gen types typescript --project-id Reference ID > db_types.ts I got the error below:

cp: cannot stat '/c/Users/Aladdin/AppData/Local/npm-cache/_npx/e32269122bb7f099/node_modules/.bin/template.gen': No such file or directory

[softwarebyze]

I ran npx gen types typescript --project-id Reference ID > db_types.ts I got the error below:

cp: cannot stat '/c/Users/Aladdin/AppData/Local/npm-cache/_npx/e32269122bb7f099/node_modules/.bin/template.gen': No such file or directory

Looks like you're forgetting supabase. I suggest to alter the command to npx supabase gen types typescript --project-id Reference ID > db_types.ts

[softwarebyze]

Hey, I'm using supabase: 1.12.2 and when I run the command above, I get an error: Error: unknown flag: --project-id

I also got the same error then I upgraded to v1.14.3 and it worked. I had installed it with brew so brew upgrade supabase

supabase gen types typescript --project-id your-project-id> app/types/supabase.ts

Please note that the autocomplete might not show project-id but the command works.

Should add this to docs

Here it is 😄