使用 NextJS 时在 NexusJS 中定义 contextType 的正确方法

Posted

技术标签:

【中文标题】使用 NextJS 时在 NexusJS 中定义 contextType 的正确方法【英文标题】:Correct way to define contextType in NexusJS while using NextJS 【发布时间】:2021-04-08 11:20:41 【问题描述】:

我试图让 Prisma 和 Nexus 与 NextJS 一起工作,但在 GraphQL 架构中定义 contextType 时遇到了一些问题。

我这样定义架构:

export const schema = makeSchema(
  types: [Query, User, Mutation],
  contextType: 
    module: require.resolve("./graphql/context"),
    export: "Context",
  ,
  plugins: [nexusPrisma( experimentalCRUD: true )],
  outputs: 
    typegen: path.join(process.cwd(), "generated", "nexus-typegen.ts"),
    schema: path.join(process.cwd(), "generated", "schema.graphql"),
  ,
);

当我通过运行npm run dev 启动开发服务器时发生错误。错误如下:

Module not found: Can't resolve './graphql/context'
  46 |   types: [Query, User, Mutation],
  47 |   contextType: 
> 48 |     module: require.resolve("./graphql/context"),
     |            ^
  49 |     export: "Context",
  50 |   ,
  51 |   plugins: [nexusPrisma( experimentalCRUD: true )],

这是context.ts 文件:

import  PrismaClient  from "@prisma/client";

const prisma = new PrismaClient();

export interface Context 
  prisma: PrismaClient;


export function createContext(): Context 
  return  prisma ;

我的依赖是这些:

  "dependencies": 
    "@prisma/client": "^2.13.1",
    "apollo-server-micro": "^2.19.1",
    "next": "latest",
    "nexus": "^1.0.0",
    "nexus-plugin-prisma": "^0.27.0",
    "react": "^16.12.0",
    "react-dom": "^16.12.0"
  ,
  "devDependencies": 
    "@prisma/cli": "^2.13.1",
    "@types/node": "^12.12.21",
    "@types/react": "^16.9.16",
    "@types/react-dom": "^16.9.4",
    "typescript": "^4.1.3"
  ,

我一直在寻找解决方案,但现在我被困住了。我认为这可能与 NextJS 及其 Webpack 配置有关,但我对这些完全不了解,所以我真的不知道该尝试什么。

感谢任何帮助。

项目树:

root
├─ generated
│  ├─ nexus-typegen.ts
│  └─ schema.graphql
├─ graphql
│  ├─ context.ts
│  └─ schema.ts
├─ interfaces
│  └─ index.ts
├─ next-env.d.ts
├─ package-lock.json
├─ package.json
├─ pages
│  ├─ api
│  │  ├─ graphql.ts
├─ prisma
│  └─ schema.prisma
├─ tsconfig.json

【问题讨论】:

【参考方案1】:

我认为错误出在您为模块提供的路径中。假设您已在 ./schema.ts 中定义架构,您的上下文类型应如下所示,因为它是您需要指定的相对路径

contextType: 
  module: require.resolve("./context"),
  export: "Context",

【讨论】:

【参考方案2】:

这种方法对我有用:

  contextType: 
    module: path.join(process.cwd(), "graphql", "context.ts"),
    export: "Context",
  

【讨论】:

以上是关于使用 NextJS 时在 NexusJS 中定义 contextType 的正确方法的主要内容,如果未能解决你的问题,请参考以下文章

NexusJS 错误:TypeError:类构造函数 GraphQLNonNull 不能在没有“新”的情况下调用

Tailwind CSS 动画在 ReactJs/NextJs 中不起作用

NextJS - 无法在 Tailwind CSS 中使用自定义颜色

单击 NextJS 的按钮时,服务器端在 React 中呈现模式

UnhandledPromiseRejectionWarning:ReferenceError:TextEncoder 未在 NextJS 12 中定义

UnhandledPromiseRejectionWarning:ReferenceError:TextEncoder 未在 NextJS 12 中定义