此存储库包含用于Chrome和Firefox的Apollo Client Browser Devtools扩展。

安装

Chrome网页商店

Chrome用户可以通过访问 Chrome网页商店.

Opera用户可以从Chrome Web Store使用 下载Chrome扩展 Opera插件。

火狐

Firefox用户可以通过 Firefox浏览器插件.

安装本地版本

如果您想安装本地版本的扩展，请跳到 发展中 部分。

功能

Apollo Client Browser Devtools在你的web浏览器检查器中显示为“Apollo”选项卡，旁边还有其他选项卡，如“Elements”和“Console”。devtools目前有四个主要特性：

• 浏览器: Apollo Studio Explorer的内置版本，允许您直接使用应用程序的网络接口对GraphQL服务器进行查询（无需配置）。
• 监视查询检查器： 查看活动查询、变量、缓存结果，并重新运行单个查询。
• 突变检查员: 查看触发的突变、变量，并重新运行单个突变。
• 缓存检查员: 可视化Apollo Client缓存，并通过字段名和/或值对其进行搜索。

Apollo Client版本支持

如果您使用的是旧版本的阿波罗客户端，并且我们的客户端浏览器开发工具有问题，我们建议您升级到最新版本的阿波罗客户端。

• 我们为当前的小版本提供积极的支持 阿波罗的客户 用于我们的客户端浏览器开发工具。
• 我们尽最大努力支持老年人 3.x 版本的 阿波罗的客户 用于我们的客户端浏览器开发工具。
• 我们不提供支持 2.x 版本的 阿波罗的客户 用于我们的客户端浏览器开发工具。

配置

当您的应用程序处于开发模式时，devtools将在web浏览器检查器中显示为“Apollo”选项卡。要在生产环境中为应用程序启用devtools，请通过 connectToDevTools: true 到应用程序中的ApolloClient构造函数。通过 connectToDevTools: false 如果想手动禁用此功能。

“Apollo”选项卡将出现在您的web浏览器检查器中 window.__APOLLO_CLIENT__ 对象存在于应用程序中。Apollo Client自动将此钩子添加到窗口，除非 process.env.NODE_ENV === 'production'． 如果您想在生产环境中使用devtools，请手动将您的Apollo Client实例附加到 window.__APOLLO_CLIENT__ 或通过 connectToDevTools: true 构造函数。

如果您看到“阿波罗”选项卡，但仍然有问题，请跳到 调试 部分。

发展中

构建扩展

在构建扩展之前，您应该安装依赖项：

# Install dependencies
> npm install

# (Optional) build the extension for local use
> npm run build -- --env TARGET=chrome
# or
> npm run build -- --env TARGET=firefox

# Or generate zipped distributables (already includes the above build step)
> npm run dist:chrome
# or
> npm run dist:firefox

运行示例应用程序

阅读更多.

开发与web-ext和WebExtWebpackPlugin

阅读更多.

测试

我们使用 开玩笑 和 React测试库 来编写和运行我们的测试。

对两者进行测试 src 和 development，执行如下命令：

npm run test

你也可以用 --watch 自动观察并重新运行测试：

npm run test:watch

文件夹结构

阅读更多.

调试

阅读更多.

本地测试

阅读更多.

行为准则

这个项目是由 阿波罗行为准则.

阿波罗是谁？

阿波罗 构建开源软件和图形平台，在应用程序和服务中统一GraphQL。我们通过以下方式帮助您更快地发货：

• 阿波罗工作室 -一个免费的端到端平台，用于管理GraphQL生命周期。在托管注册中心中跟踪GraphQL模式，为图中的所有内容创建一个事实来源。Studio提供了一个IDE (Apollo Explorer)，因此您可以浏览数据、协作查询、观察使用情况并安全地进行模式更改。
• 阿波罗联盟 -行业标准的开放架构，用于构建分布式图。使用Apollo的网关从多个子图组成一个统一的图，确定查询计划，并跨服务路由请求。
• 阿波罗的客户 -最流行的GraphQL客户端。阿波罗也建造和维护 阿波罗iOS 和 阿波罗芬兰湾的科特林.
• 阿波罗服务器 -一个生产就绪的JavaScript GraphQL服务器，可以连接到任何微服务、API或数据库。与所有流行的JavaScript框架兼容，可部署在无服务器环境中。

学习如何建造阿波罗

请查看 奥德赛 学习平台，通过视频和交互式代码挑战开始您的GraphQL之旅的完美场所。加入 阿波罗社区 与GraphQL社区进行交互并获得技术帮助。

维护人员