node 服務端
代碼代碼抽取層次分爲html
schema
定義node
類型
業務對象
查詢
更改
resolvers
實現git
查詢
方法
typeResolvers
實現github
自定義類型
標準類型
utils
工具npm
mock
. ├── index.js | 主程序 ├── resolvers | 查詢 更新 實現 │ ├── Mutations.js | 更新 │ ├── Querys.js | 查詢 │ └── index.js | 入口 ├── schema | 模型定義 │ ├── business | 業務定義 │ │ ├── comment.graphql | 評論 │ │ └── post.graphql | 文章 │ └── std | 類型定義 │ ├── Mutation.graphql | 更新 │ ├── Query.graphql | 查詢 │ ├── enum.graphql | 枚舉 │ ├── interface.graphql | 接口 │ ├── scalar.graphql | 自定義類型 │ └── union.graphql | 聯合 ├── typeResolvers | 類型實現 │ ├── index.js | 入口 │ ├── interfaces.js | 接口 │ ├── scalars.js | 自定義類型 │ ├── types.js | 業務類型 │ └── unions.js | 聯合 └── utils | 工具 └── mock.js | 模擬
說明bash
Graphql
組件層次來切分的,適合小業務項目子業務模塊
的目錄schema
定義採用文件擴展名 .graphql
規範點總有好處的,你能夠寫成 .gpl
或者 .graphql
模塊化
VSCode
語法支持插件 GraphQL for VSCode
我主要用語法高亮
require-graphql-file
支持模塊化 .graphql
文件npm i -S require-graphql-file
index.js
import requireGraphQLFile from 'require-graphql-file' ... // 讀取 schema const typeDefs = [ requireGraphQLFile('./schema/std/scalar'), // requireGraphQLFile('./schema/std/enum'), // requireGraphQLFile('./schema/std/interface'), // requireGraphQLFile('./schema/std/union'), requireGraphQLFile('./schema/business/post'), requireGraphQLFile('./schema/business/comment'), requireGraphQLFile('./schema/std/Query'), requireGraphQLFile('./schema/std/Mutation') ] ... // 合併 schema const schema = makeExecutableSchema({ typeDefs, ... })
其實就是讀取文本
文件,而後合併了傳參給makeExecutableSchema
schema
定義按 業務類型
和 組件類型
切分工具
業務類型
的文件名都是有意義的業務名稱 Post
Comment
組件類型
的名字能夠很肯定 enum
interface
union
scalar
方便查找├── schema | 模型定義 │ ├── business | 業務定義 │ │ ├── comment.graphql | 評論 │ │ └── post.graphql | 文章 │ └── std | 類型定義 │ ├── Mutation.graphql | 更新 │ ├── Query.graphql | 查詢 │ ├── enum.graphql | 枚舉 │ ├── interface.graphql | 接口 │ ├── scalar.graphql | 自定義類型 │ └── union.graphql | 聯合
代碼參考post
見上文學習
分解器
代碼我認爲 分解器
代碼有兩種
Query查詢
Mutations更新
, 我都放在 resolvers
目錄interface
scalar
type
union
, 都放在 typeResolvers
目錄├── resolvers | 查詢 更新 實現 │ ├── Mutations.js | 更新 │ ├── Querys.js | 查詢 │ └── index.js | 入口 ├── typeResolvers | 類型實現 │ ├── index.js | 入口 │ ├── interfaces.js | 接口 │ ├── scalars.js | 自定義類型 │ ├── types.js | 業務類型 │ └── unions.js | 聯合
代碼參考
import resolvers from './resolvers' import typeResolvers from './typeResolvers' ... // 合併 schema const schema = makeExecutableSchema({ typeDefs, resolvers, typeResolvers, resolverValidationOptions: { requireResolversForResolveType: false } })
resolvers
typeResolvers
目錄下寫了 index.js
進行合併mock
mock
數據如何模擬請移步 06-graphql-採用-mockjs-mock數據
# 請求 { posts { id title content author addtime comments { id message author addtime } } } # 輸出 { "data": { "posts": [ { "id": 90932, "title": "十分長現維整", "content": "常氣火熱成或", "author": "文霞", "addtime": "10:21:14", "comments": [ { "id": 30874, "message": "十稱軍題片格員主實", "author": "局反重間半何", "addtime": "22:05:28" }, { "id": 7088, "message": "克此快候己林層省", "author": "備從當提屬", "addtime": "15:45:27" }, { "id": 74989, "message": "部織溫制流統響教廣", "author": "領重你包計", "addtime": "03:06:03" }, { "id": 24501, "message": "識消己滿軍子酸", "author": "調始相內向中取造還比", "addtime": "05:15:38" }, { "id": 91765, "message": "重開流報着色運黨快但", "author": "兒動心裏放改聲口立", "addtime": "04:53:28" }, { "id": 48731, "message": "氣即感共就林始", "author": "進在層只做", "addtime": "10:29:44" } ] }, { "id": 67359, "title": "開被幾此圖位便目做", "content": "應衆級向由把", "author": "孟傑", "addtime": "16:49:30", "comments": [ { "id": 28432, "message": "大命格我就戰歷", "author": "親但美在號場米商", "addtime": "13:18:11" }, { "id": 36258, "message": "紅條由近的備級", "author": "自團人老以音狀裝指號", "addtime": "13:17:17" }, { "id": 90117, "message": "麼整片外習達離", "author": "滿步該律特", "addtime": "16:10:35" }, { "id": 14731, "message": "場等九百市很安", "author": "白石價和林風農", "addtime": "18:33:41" }, { "id": 23523, "message": "二面化權文及照萬", "author": "運現裏新政過鐵", "addtime": "17:51:59" }, { "id": 77423, "message": "劃羣低礦流按看實養", "author": "個爲然工些效", "addtime": "21:56:41" } ] } ] } }