自動生成GraphQL接口文件的步驟

https://blog.csdn.net/qq_31851435/article/details/102853649

1、安裝CLI

$ yarn add -D graphql @graphql-codegen/cli

2、初始化

$ graphql-codegen init

gql文件示例 

 

//String$backendIds

backendIds
    name

    sellerPhone

    accountType

    id

    disabled

  }

}

 

 

// current-user.gql

 

 

query CurrentUser {

 

 

　　currentUser {

 

 

　　　　role

 

 

　　　　liveRoom {

 

 

　　　　　　id

 

 

　　　　　　name

 

 

　　　　}

　　}

 

 

}

 

 

 初始化命令執行后會在根目錄下生成 codegen.yml，這個文件可以根據 graphql 的接口自動生成調用方法，生成文件在 libs/xxx/graphql/documents.ts（這個地址是你自己項目里配置的地址），然后直接引用里面的方法來調接口

　　// codegen.yml

　　　overwrite: true

　　schema: "http://localhost:3333/xxx-api/graphql"

　　documents: "libs/xxx/graphql/**/*.{gql,graphql}"

　　generates:

　　　　libs/xxx/graphql/documents.ts:

　　　　plugins:

　　　　 - "typescript"

　　　　 - "typescript-operations"

　　　　 - "typescript-apollo-angular"

注意：接口地址必須指定正確，否則執行命令會報錯

 3、執行生成命令

 

// package.json

 

"scripts":{

　　"generate": "graphql-codegen --config codegen.yml"

}

 

flutter下相關文件格式

// codegen.yml

schema: "相關網址接口"

overwrite: true

generates:

  ../lib/gql(自定義生成gql)/model.dart:

    plugins:

      - graphql-to-dart

config:

  requiredFields: false

  parts:

    - "model.g.dart"

  generateFragmentHelpers:

    excludeFields:

      - onType: Query

      - onType: Mutation

  irreducibleTypes:

    -

 

 

// package.json

{

　　"scripts": {

　　 "gql-gen": "gql-gen",

　　 "format": "cd .. && flutter format lib/gql(自定義目錄)/mode.dart",

　　 "source-gen": "cd .. && flutter packages pub run build_runner build --delete-conflicting-outputs",

　　 "build": "yarn gql-gen && yarn format && yarn source-gen"

　　},

　　"dependencies": {

　　 "graphql": "^14.7.0",

　　 "graphql-code-generator": "^0.18.2",

　　 "graphql-to-dart": "^0.3.6"

　　}

}