Prisma Entity Relationship Diagram Generator

Prisma generator to create an ER Diagram every time you generate your prisma client.

Like this tool? @Skn0tt started this effort with his web app ER diagram generator

npm i -D prisma-erd-generator @mermaid-js/mermaid-cli
# or
yarn add -D prisma-erd-generator @mermaid-js/mermaid-cli

Add to your schema.prisma

generator erd {
  provider = "prisma-erd-generator"
}

Run the generator

npx prisma generate

Versions

Prisma >= 4 use 1.x.x
Prisma <4 use 0.11.x

Options

Additional configuration

Output

Change output type and location

Usage

generator erd {
  provider = "prisma-erd-generator"
  output = "../ERD.svg"
}

Extensions

svg (default: ./prisma/ERD.svg)
png
pdf
md

Theme

Theme selection

Usage

generator erd {
  provider = "prisma-erd-generator"
  theme = "forest"
}

Options

default (default)
forest
dark
neutral

mmdcPath

In order for this generator to succeed you must have mmdc installed. This is the mermaid cli tool that is used to generate the ERD. By default the generator searches for an existing binary file at /node_modules/.bin. If it fails to find that binary it will run find ../.. -name mmdc to search through your folder for a mmdc binary. If you are using a different package manager or have a different location for your binary files, you can specify the path to the binary file.

generator erd {
  provider = "prisma-erd-generator"
  theme = "forest"
  mmdcPath = "node_modules/.bin"
}

Disabled

You won't always need to generate a new ERD. For instance, when you are building your docker containers you often run prisma generate and if this generator is included, odds are you aren't relying on an updated ERD inside your docker container. It also adds additional space to the container because of dependencies such as puppeteer. To disabled running this generator just add an environment variable to the environment running prisma generate.

DISABLE_ERD=true

Another option used is to remove the generator lines from your schema before installing dependencies and running the prisma generate command. I have used sed to remove the lines the generator is located on in my schema.prisma file to do so. Here is an example of the ERD generator being removed on lines 5-9 in a dockerfile.

# remove and replace unnecessary generators (erd generator)
# Deletes lines 5-9 from prisma/schema.prisma
RUN sed -i '5,9d' prisma/schema.prisma

Debugging

If you have issues with generating or outputting an ERD as expected, you may benefit from seeing output of the steps to making your ERD. Enable debugging by either adding the following environment variable

ERD_DEBUG=true

or adding in the debug configuration key set to true

generator erd {
  provider = "prisma-erd-generator"
  erdDebug = true
}

and re-running prisma generate. You should see a directory and files created labeling the steps to create an ER diagram under prisma/debug.

Please use these files as part of opening an issue if you run into problems.

Table only mode

Table mode only draws your models and skips the attributes and columns associated with your table. This feature is helpful for when you have lots of table columns and they are less helpful than seeing the tables and their relationships

generator erd {
  provider = "prisma-erd-generator"
  tableOnly = true
}

Include relation from field

By default this module skips relation fields in the result diagram. For example fields userId and productId will not be generated from this prisma schema.

model User {
  id            String         @id
  email         String
  favoriteProducts  FavoriteProducts[]
}


model Product {
  id              String        @id
  title           String
  inFavorites  FavoriteProducts[]
}

model FavoriteProducts {
  userId      String
  user        User    @relation(fields: [userId], references: [id])
  productId   String
  product     Product @relation(fields: [productId], references: [id])

  @@id([userId, productId])
}

It can be useful to show them when working with RDBMS. To show them use includeRelationFromFields = true

generator erd {
  provider = "prisma-erd-generator"
  includeRelationFromFields = true
}

Issues

Because this package relies on mermaid js and puppeteer issues often are opened that relate to those libraries causing issues between different versions of Node.js and your operating system. As a fallback, if you are one of those people not able to generate an ERD using this generator, try running the generator to output a markdown file .md first. Trying to generate a markdown file doesn't run into puppeteer to represent the contents of a mermaid drawing in a browser and often will succeed. This will help get you a functioning ERD while troubleshooting why puppeteer is not working for your machine. Please open an issue if you have any problems or suggestions.

Contributors ✨

Thanks goes to these wonderful people (emoji key):

_{John Fay} 🚧 💻 🤔 🐛	_{Jonas Strassel} 🐛 💻	_{Steve Gray} 💻 🤔	_{Jason Abbott} 🐛 💻	_{Manuel Maute} 🐛 💻	_{James Homer} 💻	_{Jan Piotrowski} 🐛 💻 👀
_{Luke Evers} 💻	_rikuyam 💻	_{Francis Manansala} 🐛	_{Vitalii Yarmus} 💻	_{Petri Julkunen} 🐛	_D-PONTARO 💻