typescript - เกิดข้อผิดพลาดเมื่อใช้ Prisma กับ tRPC: ประเภทการคืนค่าของฟังก์ชันที่ส่งออกมีหรือใช้ชื่อ 'prisma' จากโมดูลภายนอก

ฉันกำลังพยายามรวม Prisma เข้ากับ tRPC สำหรับแบ็กเอนด์ของฉัน ทั้งคู่ทำงานได้ดีเมื่อใช้งานแยกกัน แต่เมื่อฉันพยายามรวมพวกมันเข้าด้วยกัน จะเกิดข้อผิดพลาดขึ้น

นี่คือข้อความแสดงข้อผิดพลาดที่ฉันได้รับ:

TS4058: ประเภทค่าที่ส่งคืนของฟังก์ชันที่ส่งออกมีหรือกำลังใช้ชื่อ 'prisma' จากโมดูลภายนอก "/Users/nils/Code/nextjs-coespace/node_modules/.prisma/client/index" แต่ไม่สามารถตั้งชื่อได้

ไฟล์ที่ฉันได้ไคลเอนต์ Prisma ของฉันมาจาก:

// Note! This file has been copied from:
// https://github.com/prisma/prisma-examples/blob/latest/typescript/rest-nextjs-api-routes-auth/lib/prisma.ts

import { PrismaClient } from '@prisma/client';

// PrismaClient is attached to the `global` object in development to prevent
// exhausting your database connection limit.
//
// Learn more:
// https://pris.ly/d/help/next-js-best-practices

// eslint-disable-next-line import/no-mutable-exports
let prisma: PrismaClient;

if (process.env.NODE_ENV === 'production') {
  prisma = new PrismaClient();
} else {
  if (!global.prisma) {
    global.prisma = new PrismaClient();
  }
  prisma = global.prisma;
}

export default prisma;

ตัวควบคุม tRPC ของฉัน:

import createRouter from '@/src/lib/server/trpc/routers/router';
import prisma from '@/src/lib/server/prisma';
import { z } from 'zod';

export default function locationRouter() {
  return createRouter()
    .mutation('create', {
      input: z.object({
        id: z.string().uuid(),
        // ...
      }),
      resolve(req) {
        return prisma.location.create({
          data: req.input,
        });
      },
    })
    .query('findMany', {
      resolve() {
          return prisma.location.findMany()
      },
    });
}

คำตอบ #1

ฉันคิดว่ามันคล้ายกับอันนี้

ฉันเคยมีปัญหาแบบเดียวกัน ซึ่งฉันแก้ไขโดยการแสดงคำสั่งนั้น

คำตอบ #2

คุณกำลังส่งคืน promise ที่ครอบ prisma จากการ resolve ของคุณ ซึ่งหมายความว่า prisma เป็นส่วนหนึ่งของประเภทการคืนค่า นำไปสู่ข้อความข้อผิดพลาด ข้อความข้อผิดพลาดสามารถเข้าใจได้หากคุณพิจารณาเรื่องนี้

วิธีแก้คือการ await ผลลัพธ์อย่างชัดเจน ซึ่งทำให้ prisma ไม่ อยู่ใน resolve แน่นอนว่าคุณยังคงส่งคืน promise แต่ await นั้นป้องกันไม่ให้ prisma ถูกส่งออกพร้อมกับ export type LocationRouter=typeof locationRouter ถ้าคุณวางเมาส์บน resolve คุณจะเห็นลายเซ็นว่า

(property) resolve: ProcedureResolver<unknown, undefined, trpc.InferLast<Promise<template[]> & {
    [prisma]: true;
}>>

การแก้ไขต่อไปนี้แก้ไขข้อผิดพลาดของฉัน (และอาจของคุณด้วย):

  .query("findMany", {
    resolve: async () => {
      return await prisma.location.findMany()
    },
  })

ด้วย await ลายเซ็นของ resolve ตอนนี้คือ

(property) resolve: ProcedureResolver<unknown, undefined, template[]>

คุณจะต้องทำสิ่งนี้สำหรับ resolve ทุกตัวที่ใช้ prisma