Learn how to create a custom Prisma Generator that outputs TypeScript types from your Prisma schema.
8 min read
— views
What is a Prisma Generator?
A Prisma Generator is a tool that takes your Prisma Schema and generates code from it.
You should already be familiar with prisma-client-js, which is a Prisma generator that
generates a Prisma client and TypeScript types from your schema.
Why create a custom Prisma Generator?
There are a few reasons why you might want to create a custom Prisma Generator. The most useful thing I found was to
publish your Prisma types to npm or GitHub Packages. This way, you can share your Prisma types with other developers and share them across
multiple projects.
It also allows you to generate other custom outputs. For example, if you want to use TypeScript enums
instead of Prisma's "object enums". There are several side effects to using TypeScript enums, so you should
always consider whether it's necessary to use them.
How to create a custom Prisma Generator
Create a new npm project
Firstly, we will create the folder where we'll store our code. We'll also initialize a new npm project:
Install dependencies
Secondly, we'll install the required dependencies:
We must also install the dev dependencies:
You'll notice we're also installing prettier, which will be used to format the generated code
before we write to a file.
Initialize TypeScript
We must make sure to also initialize TypeScript in our project:
Now we are ready to start writing our generator!
Create a Prisma generator
Now, we'll create the actual generator. We will separate each part of the generator into its own handler file and function,
this allows us to easily maintain our generator. Create a new file src/generator.ts and add the following code:
Let's now handle the onManifest function. This will allow us to specify defaults and other information for our generator.
Create a new file src/on-manifest.ts and add the following code:
Now, we'll handle the onGenerate function. This is where we'll actually generate our types.
I'll explain each section of the generator from here on out.
Create a new file src/on-generate.ts and add the following code:
Convert Prisma models to TypeScript interfaces
Firstly, we will convert the Prisma Models to TypeScript interfaces:
Convert Prisma enums to TypeScript types
Next, we'll convert the Prisma enums to TypeScript types.
Need TypeScript enums instead?
Learn how to use TypeScript enums 👉
Replace the highlighted code above with the following code:
Write to a file
Finally, we'll write the generated types to a file:
Required Utilities
We also need a node bash file to run our generator, Prisma will execute this file when we run prisma generate.
Create a new file src/bin.ts and add the following code:
Previously, we used a utility function getTypeScriptType to convert Prisma types to TypeScript types.
Create a new file src/utils.ts and add the following code:
Make sure to import this utility function in src/on-generate.ts:
Publising
Preparation
Before we can publish our package, there are a few things we need to do in our package.json file:
main: our main entry point, this is where Prisma will look for our generator.
files: the files that will be included when publishing our package.
bin: the name of the executable file that Prisma will run when we run prisma generate.
scripts: the build script that will be used to build our generator before publishing.
Once we've done this, we can build our package:
Publishing to npm
Now, we can publish our package to npm:
That's it! You can now install and use your custom Prisma Generator in your Prisma schema:
GitHub Repository
You can find the full source code for this generator on GitHub