GraphQL autocompletion (Prisma ORM v6) (/docs/orm/v6/more/troubleshooting/graphql-autocompletion)
For the complete Prisma documentation index, see llms.txt. A markdown version of any docs page is available by appending
.mdto its URL.
Get autocompletion for Prisma Client queries in GraphQL resolvers with plain JavaScript
Location: ORM > v6 > More > Troubleshooting > GraphQL autocompletion
When using GraphQL with TypeScript, you get autocompletion for the Prisma Client instance in your GraphQL resolvers because the context object can be typed. In plain JavaScript, this needs a little more effort.
Problem
Section titled “Problem”In a resolver like this:
filterPosts: (parent, args, ctx) => {
return ctx.prisma.post.findMany({
where: {
OR: [
{ title: { contains: args.searchString } },
{ content: { contains: args.searchString } },
],
},
});
};VS Code doesn't know the type of the context object so it can't provide any intellisense.
Solution
Section titled “Solution”Add a JSDoc comment named typedef to "import" the correct type:
// Add this to the top of the file
/**
* @typedef { import("../prisma/generated/client").PrismaClient } Prisma
*/Then type your resolver arguments:
/**
* @param {any} parent
* @param {{ searchString: string }} args
* @param {{ prisma: Prisma }} ctx
*/
filterPosts: (parent, args, ctx) => {
return ctx.prisma.post.findMany({
where: {
OR: [
{ title: { contains: args.searchString } },
{ content: { contains: args.searchString } },
],
},
});
};This tells VS Code that context has a property named prisma with type Prisma, enabling autocompletion.
Complete example
Section titled “Complete example”/**
* @typedef { import("../prisma/generated/client").PrismaClient } Prisma
* @typedef { import("../prisma/generated/client").UserCreateArgs } UserCreateArgs
*/
const { makeExecutableSchema } = require("graphql-tools");
const resolvers = {
Query: {
/**
* @param {any} parent
* @param {any} args
* @param {{ prisma: Prisma }} ctx
*/
feed: (parent, args, ctx) => {
return ctx.prisma.post.findMany({
where: { published: true },
});
},
/**
* @param {any} parent
* @param {{ searchString: string }} args
* @param {{ prisma: Prisma }} ctx
*/
filterPosts: (parent, args, ctx) => {
return ctx.prisma.post.findMany({
where: {
OR: [
{ title: { contains: args.searchString } },
{ content: { contains: args.searchString } },
],
},
});
},
},
};Related pages
Section titled “Related pages”Bundler issues: Solve ENOENT package error with vercel/pkg and other bundlersCheck constraints: Learn how to configure CHECK constraints for data validation with Prisma ORM and PostgreSQL.Many-to-many relations: Learn how to model, query, and convert many-to-many relations with Prisma ORMNext.js: Best practices and troubleshooting for using Prisma ORM with Next.js applications.Nuxt: Learn how to integrate Prisma ORM with your Nuxt application.