Zenn
🐱

Nuxt3.16でPrismaを使用しているとbuildでエラーになるー(Prisma@6.6で解決できるようになったよー)

2025/04/10に公開
Prisma
Vue 3
Nuxt 3
tech

改定

記事を投稿した時は、cjsだからダメだったと思い込んで、ESMでやろーぜ的な投稿をしたのですがー
一晩寝て頭がすっきりしたら『いやいやcjsでもロードできるでしょ・・・』と、どうしても解せない部分があって・・・
再度ちゃんと調査したらやっぱり単純にcjsだからというわけではなく@prisma/client/index.jsがcjsなので6.x系のジェネレータで作成されるnode_moduleの中の.prismaフォルダが認識できないだけでしたー(PrismaClientをcjsで作成しても動く)
というわけで、内容を書き直しましたー

本文

角田選手がレッドブルに昇格して(F1の話)毎日わくわくドキドキなりょうです、こんにちは
次のバーレーンも期待！！
角田選手 頑張れー！！頑張れー！！

さてさて、いい加減本題です。

結構前に、Nuxtが3.16にバージョンアップされましたが、
Nuxt & Prismaの環境でNuxtを3.16にバージョンアップさせると
Invalid module!! Invalid module!!
と連呼されNuxtのビルドが通らなくなります・・・

F1観たり、キングダムのアニメをいまさらながら観てる場合じゃないです。
大変やー 大変やー

発生環境

nuxt@3.16以降
prisma(多分、6.x以前はどのバージョンでも)

現象

Prisma@6.xのジェネレータで生成したPrisma Clientはnode_modulesの中に.prismaにというフォルダを作成し、そこにtypeなどの定義が置かれます。
このnode_modules\.prismaのフォルダは@prisma\client\index.jsからrequireで呼ばれるのですが、Nuxtを3.16にバージョンアップさせると、unjsやNitorやらのバージョンがだいぶ上がってしまい、そのままでは、このフォルダが認識できずエラーとなってしまいます。

対応

Prisma@6.6では新しいPrisma Clientのジェネレータが搭載されました。
この新しいジェネレータはいろいろなことができるようになっているのですが、
その中の一つに出力先を指定することができるようなっています！(というか必須項目)
この出力先を指定する機能を利用し、Prisma Clientの出力先を6.x系のジェネレータの出力先であるnode_modules\.prismaから変更することで、Nuxt3.16以降の環境でもBuildが通るようになります！！(わーい

Prisma Clientの出力先を変更するって、どーやんの？

Prisma Clientの出力先を変更するには、新しいジェネレータに変更 & outputで出力先を指定
そしてPrisma Clientを作り直す(prisma generate)必要があります！！

  1. prisma @prisma/client を6.6.0にバージョンアップ
    これで新しいジェネレータが使用できるようになります。
     
  2. schema.prismaの中にあるPrisma Clientのジェネレートの設定で、
    新しいジェネレータに変更 & 出力先の指定
generator client {
-  provider = "prisma-client-js"  //6.x系のGenerator
+  provider = "prisma-client"     //新しいPrisma Client Generator (-jsが外れてます)
+  output   = "../.prisma"        //Prisma Clientの出力先 (どこでも良いよー)
}

 
3. 新しいPrisma Clientを作成！

   npx prisma generate

 
4. PrismaClientを新しく作成したPrisma Clientに変更

- import { PrismaClient } from '@prisma/client';
+ import { PrismaClient } from '~~/.prisma/client';  //outputで指定した出力した新しいClient

 
これでNuxt3.16環境でも動作するようになりまーす！！

6.x系のジェネレータで動かない？ 6.6は6.xのジェネレータと違うの？

6.6で追加された新しいジェネレータはアーリーアクセスとして展開されており、7.0からデフォルトのジェネレータになるっぽいです。
という事でー

6.ｘ系のデフォルトのジェネレータで生成したPrisma Clientでは動かず
6.6で追加された新しいジェネレータ(もしくは7.0以降のデフォルトジェネレータ)で生成したPrisma Clientでは動作する

という感じになります!
 
 
参考URL
https://www.prisma.io/docs/orm/prisma-schema/overview/generators?utm_source=github&utm_medium=6.6.0-release-notes#prisma-client-early-acess

Discussion