The production build is encountering an issue with a type error stating that the property 'companies' does not exist on the 'PrismaClient' type, while the local build is successful

Currently, I am working on a nextjs project hosted on Vercel, utilizing TypeScript and Prisma. Here are the versions I am using:

  • "next": "13.0.3"
  • "typescript": "4.9.3"
  • "prisma": "^4.6.1"

My local build is successful, but I am encountering a failure on Vercel:

Type error: Property 'companies' does not exist on type 'PrismaClient<PrismaClientOptions, never, RejectOnNotFound \| RejectPerOperation \| undefined>'.
--
01:05:17.287 |   
01:05:17.287 | 71 \|     },
01:05:17.288 | 72 \|     companies: async () => {
01:05:17.288 | > 73 \|       const companies = await prisma.companies.findMany();
01:05:17.289 | \|                                      ^
01:05:17.289 | 74 \|       return companies;
01:05:17.289 | 75 \|     },
01:05:17.289 | 76 \|   },

Oddly, TypeScript is not recognizing 'companies' as a property of Prisma. I've attempted to resolve this by regenerating the Prisma Client, removing the model and executing commands like prisma format, prisma generate, prisma db push. It's worth mentioning that I'm using MongoDB for this project.

Here is a snippet from './prisma/schema.prisma':

model companies {
  id   String @id @default(auto()) @map("_id") @db.ObjectId
  v    Int?   @map("__v")
  name String
}

Interestingly, production builds were smooth sailing until the addition of this new model.

Answer №1

Ensuring that npx prisma generate is included in your build process is essential. In the package.json file, you can specify the generate command within the build process like this:

{
  "name": "deployment-example-prisma-vercel",
  "dependencies": {
    "@prisma/client": "4.7.1",
    "next": "13.0.6",
    "react": "18.2.0",
    "react-dom": "18.2.0"
  },
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "vercel-build": "prisma generate && prisma migrate deploy && next build",
    "prisma:generate": "prisma generate"
  },
  "devDependencies": {
    "prisma": "4.7.1"
  }
}

Using the vercel-build command will execute the generate command to update the PrismaClient with any newly added model. If you do not utilize Prisma Migrate, you can omit the migrate deploy command.

Answer №2

My experience is similar. I made the mistake of placing the prisma folder within the src folder, when it should have been in the root directory instead. Assuming there are no other issues, moving it there should solve the problem.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Setting up a project with NextJs, ExpressJs, and connecting to postgreSQL with pgadmin for deployment

In this situation, I have a fully prepared NextJs app, an ExpressJs Server, and postgreSQL (pgAdmin) all ready to go. My question is, should I take the step to deploy Next to Vercel, obtain a domain from GoDaddy, and connect it to my project? Should I als ...

You are unable to apply 'use client' on a layout element in Next.js

While attempting to retrieve the current page from the layout.txt file, I encountered errors after adding 'use client' at the top of the page: Uncaught SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data parseMod ...

What could be causing a blank page to appear after being redirected? (Using NextJS 13 API Route)

After struggling with this issue for 2 days, I'm throwing in the towel and reaching out to the community for assistance. I've been tasked with setting up a basic login system for a new project using NextJS v13. However, it seems like a lot has c ...

What causes getServersideprops to return undefined?

The data I am trying to fetch is showing as undefined in the console. Here is the code snippet: export default function Home({ data }) { console.log(data); return ( <div> <h2>Welcome !!</h2> </div> ); } export a ...

Setting up the 'nativescript-stripe' plugin in your NativeScript Vue project for seamless integration

Trying to integrate the «nativescript-stripe» plugin into my Nativescript Vue app has been a challenge. The documentation and demos on the plugin's GitHub are geared towards Angular and TypeScript, making it difficult to adapt for Vue. Can anyone pr ...

Strategies for setting up the runtime dynamically for Nextjs API routes

After deploying my Next.js 13 app on Cloudflare Pages, I encountered an issue with the API routes. To address this, I had to export the runtime variable from each route in the following manner. export const runtime = "edge" During local developm ...

Tips for achieving a dimmed content effect on Semantic UI React within a NextJS project

I'm currently facing an issue with incorporating dimmed content into the Semantic UI React sidebar on Next.js... Here is the example of dimmed content on Semantic UI: https://i.sstatic.net/5dOGK.png This is the layout code I am using: import React, ...

CDK Error: Unable to locate MethodResponse in AWS API Gateway configuration

I'm facing an issue in vscode while trying to access the MethodResponse interface from apigateway. Unfortunately, I'm getting an error message: The type 'typeof import(".../node_modules/aws-cdk-lib/aws-apigateway/index")' d ...

Angular is known to raise the error ExpressionChangedAfterItHasBeenCheckedError

I am currently developing an Angular application using Angular version 7.0.4. My objective is to automatically set focus on the first input element of a modal if the list of working times contains more than one element. However, I am facing an issue where ...

Navigating node-expose-sspi windows authentication with NextJs: a step-by-step guide

I am facing a challenge integrating my NextJS application with Windows Active Directory. Despite extensive research, I have not come across any comprehensive articles that explain this process effectively. My attempt to utilize the node-expose-sspi module ...

Generate ES6 prototypes using TypeScript

Is it possible to enhance specific class methods in TypeScript by making them prototypes, even when the target is ES6? Additionally, can a specific class be configured to only produce prototypes? Consider the following TypeScript class: class Test { ...

Node.js is having trouble retrieving information from the SQLite database

Here's a simple code snippet I'm using to retrieve data from my sqlite database. Index.ts: import { Database } from './Class/database'; Database.checkIfExists("some ID"); Database.ts: export class Database { static sqli ...

Creating a typescript type for contextual dispatch by leveraging the values of another interface

I am seeking to define a specific type for my "reducer" function. The "reducer" function I have takes in 2 parameters: the current state and the data sent in the dispatch context (to be used by the reducer). const reducer = ( state: any, props: { ...

The issue of Next.js 13 failing to render on the browser has left users

I have encountered an issue while setting up a Next.js 13 Application. My React component is not displaying on the browser even though the global.css styles are rendering properly. I attempted to solve the problem by switching to a different browser, but u ...

How can we effectively map Typescript Enums using their keys without relying on a Map?

Consider the following Enum instances: export enum TopicCategories { GUIDES = 'Guides', TASKS = 'Tasks', CONCEPTS = 'Concepts', FORMULAS = 'Formulas', BLOGS = 'Blogs' } export enum Top ...

Loading a webpack bundled ngModule dynamically to handle a route efficiently

In an effort to make working on our large frontend projects more manageable, we are looking to split them into multiple independently deployed projects. I am attempting to integrate a bundled ngModule to handle a route from within another app. It is crucia ...

Encountering an issue with NextJS 13 when utilizing the vectorstore recommended by Langchain, specifically receiving an error message stating that HNSWLib

Currently, I am building an application utilizing Langchain and OpenAI for assistance. My approach involves loading data using JSONLoader and intending to save it in a vectorstore. This way, I can provide specific answers to user queries based on the store ...

What is the best way to verify if an object is an instance of a particular class using Jasmine testing?

In the process of developing an Angular application, I am currently working on testing a component using this guide. My goal is to ensure that when my ngOnInit() method is called, it correctly initializes my foos property with an array of Foo objects based ...

Simulating NextJS router triggers using Jest

I've been attempting to simulate NextJS router events using Jest. I came across a useful resource at NextJS router & Jest. The approach outlined there closely resembles mine. Unfortunately, the solution provided in that post is not yielding the d ...

Is it typical for Nextjs to render four times in a single instance?

"use client"; import Dashboard from "./dashboard/page"; import { useEffect } from "react"; export default function Home() { useEffect(() => { localStorage.setItem("Hello", "world"); console.lo ...