Use typegraphql-prisma with ES Modules

[valerii15298]

Is it possible to use typegraphql-prisma with ES Modules? Or are there any workarounds to make it work in nestjs + prisma + typegraphql-prisma project?
Thanks in advance!!

[MichalLytek]

Have you tried and have some issues or just asking ahead of time?

[MichalLytek]

This is an issue with TS compiler:
microsoft/TypeScript#16577

You need to find a solution that works for your codebase.

[valerii15298]

@MichalLytek
In issue you sent me they say explicitly that this feature will not be implemented in typescript ever.
I created a small reproduction repository based on your example

The few things I changed:

1. Added tsconfig.json
2. Added "type": "module" to package json and --esm` flag to ts-node
3. Updated index.ts to work with ES Modules new syntax.

If you generate type-graphql code and then try to start it (npm start or pnpm start) you will see this error:

 Cannot find module '...\typegraphql-prisma-esm\prisma\generated\type-graphql\resolvers\crud\resolvers-crud.index' imported from ...\typegraphql-prisma-esm\prisma\generated\type-graphql\index.ts

It is just not possible to make it work if emitted files use commonjs imports.
Workaround I suggested earlier is not actually suitable.
And only solution is to refactor 100+ emitted files to add '.js' extension for every import.

My point is that it Is something that should be implemented on the library level(maybe via an option in schema.prisma to generate code with '.js' extension in imports). I do not see anything I can do on the user level to make it work.

But maybe you have some thoughts how to make it work in another way?

[MichalLytek]

And only solution is to refactor 100+ emitted files to add '.js' extension for every import.

You can use a script mentioned in the issue to transform generated files or some compiler plugin to rewrite imports:
https://www.npmjs.com/package/ts-transform-esm-import

I will have to use the same strategy for type-graphql as I don't want to write all the imports with .js suffix in TS files 😵

[valerii15298]

Thank you. It is really a helpful thing the library you mentioned.
But unfortunately it does not work with nest.js(nest.js does not support ttypescript).
Do you know anything else that could solve the problem?

I tried https://github.com/wessberg/cjstoesm but it doesn't seem to transform imports in Typescript to use .is extension...

[valerii15298]

Finally I found the way. The easiest solution for me was to create empty package.json with content {} like this:

prisma generate && echo {} > ./node_modules/@generated/type-graphql/package.json

After that my project that uses ESM was able successfully import everything from generated types.
As I understood generated files here ./node_modules/@generated/type-graphql/ use CommonJS but in order for ESM project to import cjs project it needs to know that it is a separate package. So creating package.json inside ./node_modules/@generated/type-graphql/ just solved everything.

@MichalLytek FYI

[valerii15298]

Finally I found the way. The easiest solution for me was to create empty package.json with content {} like this:

prisma generate && echo {} > ./node_modules/@generated/type-graphql/package.json

After that my project that uses ESM was able successfully import everything from generated types.
As I understood generated files here ./node_modules/@generated/type-graphql/ use CommonJS but in order for ESM project to import cjs project it needs to know that it is a separate package. So creating package.json inside ./node_modules/@generated/type-graphql/ just solved everything.

[PS1TD]

I have stumbled upon the same use case and wasn't able to resolve it using the provided solutions.
My setup is a microservice that communicates to database using prisma and a backend service that would use the generated code to provide graphql endpoint. Both microservice and backend are ESM modules using babel to transpile typescript into javascript to share code.
Transpiling generated code works, however i get a circular dependency when trying to use any of the generated resolvers on the backend.
Cannot access ... before initialization.
I am also using the zod schema generator with prisma and for it there is no such issue.
I have tried every possible setting and plugin both for babel and tsconfig without success.
I believe there is some kind of issue with the generated code that causes it to create circular dependencies after transpilation to ESM module javascript.
Unfortunately there is no option to emitTranspiledCode in ESM module format