久久精品亚洲精品国产欧美,欧美激情在线看,羞羞视频网站免费入口

// 1import { createServer } from "@graphql-yoga/node";// 2const port = Number(process.env.API_PORT) || 4000// 3const server = createServer({ port});// 4server.start().then(() => { console.log(

?? GraphQL Server ready at http://localhost:</span><span class="token template-string interpolation interpolation-punctuation punctuation">${</span><span class="token template-string interpolation">port</span><span class="token template-string interpolation interpolation-punctuation punctuation">}</span><span class="token template-string string">/graphql

);});

上面的代碼執行以下操作：

從 GraphQL Yoga 導入函數createServer
創建一個變量來保存 API 的端口，如果環境中不存在 API，則默認為4000
創建 GraphQL 服務器的實例
在端口上啟動服務器，并讓控制臺知道它已啟動并正在運行4000

如果您啟動服務器，您將可以訪問正在運行的（空的）GraphQL API：

npm run dev

注意：GraphQL 服務器已啟動并正在運行，但不可用，因為您尚未定義任何查詢或更改。

設置 Schema 構建器

GraphQL 使用強類型架構來定義用戶如何與 API 交互以及應返回哪些數據。構建 GraphQL 架構有兩種不同的方法：代碼優先和 SDL 優先。

代碼優先：您的應用程序代碼定義并生成 GraphQL 架構
SDL 優先：您手動編寫 GraphQL 架構

在本應用程序中，您將使用名為 Pothos 的流行架構構建器采用代碼優先方法。

要開始使用 Pothos，您首先需要安裝 core 包：

npm i @pothos/core

接下來，創建 Pothos 架構構建器的實例作為可共享模塊。在該文件夾中，創建一個名為 for will hold this module的新文件：srcbuilder.ts

cd src

touch builder.ts

現在，從包中導入默認導出并導出名為：@pothos/corebuilder

// src/builder.ts

import SchemaBuilder from "@pothos/core";export const builder = new SchemaBuilder({});

定義標量類型DATE

默認情況下，GraphQL 僅支持一組有限的標量數據類型：

Int （整數）
浮
字符串
布爾
身份證

但是，如果您回想一下 Prisma 架構，您會記得定義了一些使用數據類型的字段。要在 GraphQL API 中處理這些問題，您需要定義自定義標量類型。DateTimeDate

幸運的是，由于開源社區，可以使用預制的自定義標量類型定義。您將使用的稱為graphql-scalars:

npm i graphql-scalars

您需要向架構構建器注冊標量，讓它知道如何處理日期。架構構建器采用一個通用的，您可以在其中指定各種配置。Date

進行以下更改以注冊標量類型：Data

// src/builder.ts

import SchemaBuilder from "@pothos/core";// 1import { DateResolver } from "graphql-scalars";

// 2export const builder = new SchemaBuilder<{  Scalars: {    Date: { Input: Date; Output: Date };  };}>({});

// 3builder.addScalarType("Date", DateResolver, {});

以下是上面代碼段中的更改內容。你：

導入標量類型的解析程序，該解析程序處理在 API 中將值轉換為正確的日期類型Date
注冊一個名為 using the configuration 的新標量類型，并配置在訪問和驗證此類型的字段時要使用的 JavaScript 類型"Date"SchemaBuilderScalars
通過提供導入的DateDateResolver

在 GraphQL 對象類型和解析程序中，現在可以使用標量類型。Date

添加 Pothos Prisma 插件

您需要做的下一件事是定義 GraphQL 對象類型。這些定義 API 將通過查詢公開的對象和字段。

Pothos 有一個很棒的 Prisma?插件，它使這個過程更加順暢，并在 GraphQL 類型和數據庫架構之間提供類型安全。

注意：Pothos 可以在 Prisma 中以類型安全的方式使用，而無需使用插件，但是該過程非常手動。

首先，安裝插件：

npm i @pothos/plugin-prisma

此插件提供了一個 Prisma 生成器，可生成 Pothos 所需的類型。在以下位置將生成器添加到您的 Prisma 架構中：prisma/schema.prisma

// prisma/schema.prisma

generator client {  provider = "prisma-client-js"}

+generator pothos {+  provider = "prisma-pothos-types"+}

datasource db {  provider = "postgresql"  url      = env("DATABASE_URL")}

model User {  id        Int       @id @default(autoincrement())  name      String  createdAt DateTime  @default(now())  messages  Message[]}

model Message {  id        Int      @id @default(autoincrement())  body      String  createdAt DateTime @default(now())  userId    Int  user      User     @relation(fields: [userId], references: [id])}

添加后，您將需要一種方法來生成 Pothos 的神器。在本系列的后面部分，每次部署此應用程序時，您都需要安裝此 API 的節點模塊并重新生成 Prisma Client，因此請繼續創建一個新的 in 來處理此問題：scriptpackage.json

// package.json

{  // ...  "scripts": {    // ...    "build": "npm i && npx prisma generate"  }}

現在你可以運行該命令來安裝你的 node 模塊并重新生成 Prisma 客戶端和 Pothos 輸出：

npm run build

當您運行上述命令時，您應該會看到 Prisma Client 和 Pothos 集成都已生成。

現在這些類型已生成，請前往。在這里，你將導入和生成的 Pothos 類型，并將它們應用于你的構建器：src/builder.tsPrismaPlugin

// src/builder.ts

import SchemaBuilder from "@pothos/core";import { DateResolver } from "graphql-scalars";+import PrismaPlugin from "@pothos/plugin-prisma";+import type PrismaTypes from "@pothos/plugin-prisma/generated";

export const builder = new SchemaBuilder<{  Scalars: {    Date: { Input: Date; Output: Date };  };}>({});

builder.addScalarType("Date", DateResolver, {});

添加生成的類型后，您會注意到 .SchemaBuilder

Pothos 足夠聰明，知道因為你使用的是 Prisma 插件，所以你需要向構建器提供一個實例。Pothos 使用它來推斷有關 Prisma Client 中的類型的信息。在下一步中，您將創建該實例并將其添加到構建器中。prisma

現在，在 builder 實例中注冊 Prisma 插件和生成的類型，讓 Pothos 知道它們：

// src/builder.ts// ...

export const builder = new SchemaBuilder<{  Scalars: {    Date: { Input: Date; Output: Date };  };+  PrismaTypes: PrismaTypes;}>({+  plugins: [PrismaPlugin],});

// ...

此時，您將再次看到 TypeScript 錯誤。這是因為現在需要為函數提供 Prisma Client 的實例。builder

在下一步中，您將實例化 Prisma 客戶端，并在 .builder

創建 Prisma Client 的可重用實例

您現在需要創建一個可重用的 Prisma Client 實例，該實例將用于查詢您的數據庫，并提供上一步中構建器所需的類型。

在名為的文件夾中創建一個新文件。srcdb.ts

touch src/db.ts

在該文件中，導入 Prisma Client 并創建名為的客戶端實例。導出該實例化的客戶端：prisma

// src/db.ts

import { PrismaClient } from "@prisma/client";export const prisma = new PrismaClient();

將變量導入并提供它以擺脫 TypeScript 錯誤：prismasrc/builder.tsbuilder

// src/builder.ts

// ...

+import { prisma } from "./db";

export const builder = new SchemaBuilder<{  Scalars: {    Date: { Input: Date; Output: Date };  };  PrismaTypes: PrismaTypes;}>({  plugins: [PrismaPlugin],+  prisma: {+    client: prisma,+  },});

// ...

Pothos Prisma 插件現已完全配置并準備就緒。這采用 Prisma 生成的類型，并允許您在 GraphQL 對象類型和查詢中輕松訪問這些類型。

最酷的是，您現在有一個單一的事實來源（Prisma 架構）來處理數據庫中的類型、用于查詢數據庫的 API 以及 GraphQL 架構。

接下來，您將看到它的實際效果！

定義 GraphQL 類型

此時，您將使用通過 Prisma 插件配置的構建器定義 GraphQL 對象類型。

注意：如果您已經在 Prisma 架構中定義了數據的形狀，那么手動定義 GraphQL 對象類型似乎是多余的。Prisma 架構定義數據庫中數據的形狀，而 GraphQL 架構定義 API 中可用的數據。

在中創建一個名為的新文件夾。然后在該新文件夾中創建一個文件：srcmodelsUser.ts

mkdir src/models

touch src/models/User.ts

在這里，您將定義將通過 GraphQL API 公開的對象類型及其相關查詢。導入實例：Userbuilder

// src/models/User.ts

import { builder } from "../builder";

由于您使用的是 Pothos 的 Prisma 插件，因此該實例現在有一個名為builderprismaObject您將用于定義對象類型。

該方法采用兩個參數：

name：此新類型表示的 Prisma 模型的名稱
options：正在定義的類型的配置

使用該方法創建類型："User"

// src/models/User.ts

import { builder } from "../builder";

+builder.prismaObject("User", {})

注意：如果您在字段中輸入之前在一組空引號中按 +，您應該會獲得一些不錯的自動完成功能，其中包含 Prisma 架構中的可用模型列表，這要歸功于 Prisma 插件。CtrlSpacename

在對象中，添加一個使用 Pothos 的 “expose” 函數定義和字段的鍵：optionsfieldsidnamemessages

// src/models/User.ts

import { builder } from "../builder";

builder.prismaObject("User", {    fields: t => ({        id: t.exposeID("id"),        name: t.exposeString("name"),        messages: t.relation("messages")    })})

注意：當您開始鍵入字段名稱時，按 + 將為您提供目標模型中與您正在使用的 “expose” 函數的數據類型匹配的字段列表。CtrlSpace

上面的函數定義了一個 GraphQL 類型定義，并在實例中注冊了它。從生成架構實際上并不會將 GraphQL 架構存儲在您可以查看的文件系統中，但是生成的類型定義將如下所示：builderbuilderUser

type User {  id: ID!  messages: [Message!]!  name: String!}

接下來，在同一文件夾中添加另一個名為：Message.ts

touch Message.ts

此文件與文件類似，不同之處在于它將定義模型。User.tsMessage

定義、和字段。請注意，該字段在您的 Prisma 架構中具有類型，并且需要一個自定義配置來定義您定義的自定義標量類型：idbodycreatedAtcreatedAtDateTimedate

// src/models/Message.ts

import { builder } from "../builder";

builder.prismaObject("Message", {  fields: (t) => ({    id: t.exposeID("id"),    body: t.exposeString("body"),    createdAt: t.expose("createdAt", {      type: "Date",    }),  }),});

此函數將生成以下 GraphQL 對象類型：

type Message {  body: String!  createdAt: Date!  id: ID!}

實施您的查詢

目前，您已為 GraphQL 架構定義了對象類型，但您尚未定義實際訪問該數據的方法。為此，您首先需要初始化一個Query類型.

在文件底部，使用的函數初始化類型：src/builder.tsQuerybuilderqueryType

// src/builder.ts

// ...

builder.queryType({});

這將注冊一個特殊的 GraphQL 類型，該類型包含每個查詢的定義，并充當 GraphQL API 的入口點。您可以在文件中定義此類型，以確保查詢生成器定義了類型，這樣您以后就可以向其添加查詢字段。builder.tsQuery

在此函數中，您可以直接添加查詢定義，但是，您將在代碼庫中單獨定義這些定義，以便更好地組織代碼。queryType

將實例導入到：prismasrc/models/User.ts

// src/models/User.ts

import { builder } from "../builder";+import { prisma } from "../db";

// ...

然后，使用的builderqueryField函數中，定義一個公開您定義的對象類型的查詢："users"User

// src/models/User.ts// ...

// 1builder.queryField("users", (t) =>  // 2  t.prismaField({    // 3    type: ["User"],    // 4    resolve: async (query, root, args, ctx, info) => {      return prisma.user.findMany({ ...query });    },  }));

上面的代碼段：

向 GraphQL 架構的類型添加一個名為Query"users"
定義一個字段，該字段解析為 Prisma 架構中的某種類型
讓 Pothos 知道此字段將解析為您的 Prisma Client 類型的數組User
為此字段設置解析程序功能。

注意：函數的參數位于參數列表的開頭。這是 Pothos 在使用用于以高性能方式加載數據和關系的函數時填充的特定字段。如果您來自 GraphQL 背景，這可能會造成混淆，因為它會更改參數的預期順序。resolvequeryprismaField

為了更好地可視化所發生的事情，以下是本節中的代碼將生成的類型和查詢：Queryusers

type Query {  users: [User!]!}

應用 GraphQL 架構

現在，您已經定義并實施了所有 GraphQL 對象類型和查詢。需要的最后一部分是將所有這些類型和查詢注冊到一個位置，并根據您的配置生成 GraphQL 架構。

在中創建一個名為的新文件。srcschema.ts

touch schema.ts

此文件將簡單地導入模型，導致文件中的代碼運行，并運行實例的函數以生成 GraphQL 架構：buildertoSchema

// src/schema.ts

import { builder } from "./builder";

import "./models/Message";import "./models/User";

export const schema = builder.toSchema({});

該函數生成 GraphQL 架構的抽象語法樹（AST）表示形式。下面，您可以看到 AST 和 GraphQL 表示形式的樣子：toSchemaGraphQLAST

scalar Date

type Message {  body: String!  createdAt: Date!  id: ID!}

type Query {  users: [User!]!}

type User {  id: ID!  messages: [Message!]!  name: String!}

在您的文件中，導入您剛剛創建的變量。該函數的配置對象采用一個名為 key 的 key，該 key 將接受生成的 GraphQL 架構：src/index.tsschemacreateServerschema

// src/index.ts

import { createServer } from "@graphql-yoga/node";+import { schema } from "./schema";

const port = Number(process.env.API_PORT) || 4000

const server = createServer({   port,+   schema,});

server.start().then(() => {  console.log(?? GraphQL Server ready at http://localhost:</span><span class="token template-string interpolation interpolation-punctuation punctuation">${</span><span class="token template-string interpolation">port</span><span class="token template-string interpolation interpolation-punctuation punctuation">}</span><span class="token template-string string">/graphql);});