2019年13大GraphQL工具和库

Posted 2021-04-30 前端之巅

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了2019年13大GraphQL工具和库相关的知识，希望对你有一定的参考价值。

作者 | Jonathan Saring

译者 | 王强

编辑 | Yonie

GraphQL 是 Facebook 内部从 2012 年开始开发的项目，于 2015 年公开发布。2018 年 11 月 7 日，GraphQL 的控制权被移交给由 Linux 基金会托管的 GraphQL 基金会。随后 GraphQL 日益普及，一个富有活力的生态系统也随之迅速成长。

这种简单有效的设计催生了一个充满活力生态系统，社区有大批关于它的内容、演讲和指南，当然还有一系列开源工具、客户端、编辑器和库，增强并完善实践中的 GraphQL 工作流程。

本文收集了一些最出色的 GraphQL 工具和库，内容涵盖客户端库、IDE 及好用的集成。这些工具排名不分先后，请随意发表评论，提出建议。

1. Apollo 服务器和客户端

APOLLO 平台是 GraphQL 的一个实现，帮助用户管理从云到 UI 的各类数据。它可以渐进引入，可以在包括 REST API 和数据库在内的现有服务上另起一层运行。

Apollo-client 是 Apollo GraphQL 的客户端库。它是一个“功能齐全的缓存式 GraphQL 客户端，集成了 React 和 Angular 等功能”。用户可以用它轻松构建通过 GraphQL 获取数据的 UI 组件，所以它与 Bit 搭配会是非常强大的组合。它的检索数据、跟踪加载和错误状态以及更新 UI 的所有逻辑都使用声明式数据提取方法封装在一个查询组件中，该组件可以由展示组件（presentational component）组成。这套方法在很多场景下可以大大简化编程工作。

Apollo-server 实现了一个符合规范的 GraphQL 服务器，可以从包括 Apollo Client 在内的任何 GraphQL 客户端上查询。用它可以使用来自任何来源的数据快速为 GraphQL 客户端构建符合生产需求、自注释的 API。它是开源服务器，既可以用作独立服务器，也能当作已有 Node.js HTTP 服务器的附加组件，还支持“无服务器”环境以及使用 GraphQL.js 构建的各种 GraphQL schema。

另外下面两个项目是对 Apollo 很好的补充：

项目一： https://github.com/apollographql/graphql-tools
项目二：https://github.com/Akryum/vue-apollo

相关链接：

APOLLO 平台： https://medium.com/@ApolloApps

Apollo-client： https://github.com/apollographql/apollo-client

Bit： https://bit.dev/

Apollo-server： https://github.com/apollographql/apollo-server

GraphQL.js： https://github.com/graphql/graphql-js

2. Bit

Bit 是一个开源工具和平台，可将可重用代码转换为不同项目都能轻松共享和开发的组件。

自发布以来，Bit 作为在项目之间组织和共享组件的模块化解决方案成绩斐然。虽然 Bit 常被用在 UI 组件上，但它为 GraphQL API 也提供了很多非常有用的独特功能。

用户可以使用 Bit 将 API 示例和客户端（例如 Apollo）转换组件，让团队可以在各种项目中轻松共享和使用，同时可以直接从消费 repo 中修改组件的代码。

这样你的 API 集成就成了一条双行线，其他人可以将 API示例组件快速应用在自己的项目中，并迅速投入实际生产环境：https://bit.dev/

以下是作为 bit 组件共享的 GraphQL API 示例：

示例一： https://hackernoon.com/make-your-graphql-api-easier-to-adopt-through-components-74b022f195c1，任何人都可以下载这些组件，根据需要修改内容，并用到他们自己的环境中。因为消费端可以直接在他们自己的项目里更改代码，所以它是最易用的 API 集成了。
示例二： https://bit.dev/giladshoham/github-graphql
示例三： https://bit.dev/mui-org/material-ui

将 React UI 组件作为 bit 组件集合。从自己的项目中直接查看、使用并开发各个组件。使用 Bit 可以非常轻松地将你自己的组件转换为这样的共享集合。

2019年13大GraphQL工具和库

转换成 Bit 的 React 组件：方便在不同应用间分享、开发和同步

3. Relay

import {graphql} from 'react-relay';
graphql`
query MyQuery {
viewer { 
id 
} 
} 
`;

Relay 是一个由 Facebook 构建的 javascript 框架，用作使用 GraphQL 的应用的高性能、可扩展的基础架构。

Relay 是 React 和 GraphQL 之间的桥梁，利用了 React 的基于组件的封装特性。组件可以通过 Relay 指定并获取自己需要的数据，这样各个组件所需的应用数据就都下到了组件本地，方便组件组合。可以查看相关博客了解更多信息： https://blog.bitsrc.io/apollo-and-relay-side-by-side-adb5e3844935

Relay 的声明性方法让用户可以使用 GraphQL 声明数据需求，然后 Relay 负责提取数据；它会将查询聚合到网络请求中，这样可以只提取你需要的数据。Relay 可以使用 GraphQL 突变在客户端和服务器上突变数据，同时具备自动数据一致性、优化更新和错误处理能力。

虽然 Relay 没有 Apollo 这样的竞争者受欢迎，但 Facebook 还是推出了 relay-modern，加入了更好的变异 API、QueryRenderer 改进，可选路由等改进。可以在此查看详情： https://facebook.github.io/relay/docs/en/new-in-relay-modern.html

4. Prisma

2019年13大GraphQL工具和库

Prisma 是一个获得了 15000 星的“数据库工具，包括 ORM、迁移和管理 UI（Postgres、mysql 和 MongoDB）“。简而言之，Prisma 旨在取代传统的 ORM 并简化数据库工作流程。借助 GraphQL，Prisma 可以轻松实现弹性、符合生产需求的 GraphQL 服务器，还有随时可用的预制 CRUD 操作、高性能的查询解析引擎、兼容 Apollo（客户端和服务器）、类型安全的解析器等等。

这是一个使用 Prisma 实现的 GraphQL 服务器的示例，它基于 Prisma 团队开发的两个更优秀的项目：GraphQL Yoga——功能齐全的 GraphQL 服务器，专注于简单的设置、高性能和出色的开发者体验；以及 GraphQL Nexus——一个代码优先、类型安全的 GraphQL Schema 构造。