前言
Apollo GraphQL 是一个功能强大的开源 GraphQL 解决方案，包括 Apollo Client、Apollo Server、Apollo Engine 等一系列工具和库。其中，@apollographql/graphql-language-service-interface 是一个为提供编辑器中自动补全和错误信息的 GraphQL 语言服务器接口。
本文将详细介绍 @apollographql/graphql-language-service-interface 的使用，可供前端开发者学习和使用。
什么是语言服务器接口？
语言服务器接口（Language Server Interface，LSI）是一个为编辑器提供代码补全、错误检查、重构等功能的标准化协议。这个协议将编辑器和语言服务器解耦，让开发者能够使用不同的语言服务器。
安装
可以使用 npm 安装 @apollographql/graphql-language-service-interface
npm install @apollographql/graphql-language-service-interface
使用
首先，我们需要创建一个实现了 LSP 的 GraphQL 语言服务。在此，我们将使用 TypeScript 作为实例的编程语言。
-- -------------------- ---- ------- ------ - ------------- - ---- ----------------- ------ - --------------- - ---- ---------------------------------------------------- ----- ------------- - --- --------------- ---------- ----- --- ----- ---------------------- - --- ---------------- ---------------------------------- --
创建 GraphQLConfig 对象的 fileNames 属性是必需的，因为该属性将告诉 GraphQL 配置文件在哪里找到您的 GraphQL 文件。这个对象还负责加载您的配置，包括 schema、客户端配置和外部变量。
LanguageService 构造函数接收 GraphQL client，并创建一个基于这个 client 的 GraphQL 语言服务。
现在，我们可以将服务绑定到任何语言服务器上，并启动监听 LSP 请求：
-- -------------------- ---- -------
------ - ----------------- ---------------- - ---- ------------------------
----- ------ - ---------------------------------------
---------------------- -- -
------ -
------------- -
----------------- -
---------- -----
------- -
--
------------------- -
---------------- ----
-
-
-
---
------------------------------------------ -- -
------ -------------------------------------
--------------------------------------
-----------------------------
--
---
----------------此处我们使用了 VSCode 的 LSP API，绑定我们的语言服务并监听 LSP 请求，包括文本同步和代码补全。
getCompletion 方法接收两个参数：
- textDocument URI，用于在服务中定位文档
- position，用于在所请求的文本中定位请求的代码补全
示例代码
-- -------------------- ---- -------
------ - ------------- - ---- -----------------
------ - --------------- - ---- ----------------------------------------------------
------ - ----------------- ---------------- - ---- ------------------------
----- ------------- - --- ---------------
---------- --------------------
---
----- ---------------------- - --- ----------------
----------------------------------
--
----- ------ - ---------------------------------------
---------------------- -- -
------ -
------------- -
----------------- -
---------- -----
------- -
--
------------------- -
---------------- ----
-
-
-
---
------------------------------------------ -- -
------ -------------------------------------
--------------------------------------
------------------------------
----------------------------
--
---
----------------总结
本教程介绍了 @apollographql/graphql-language-service-interface 的基础使用方法，可以在编辑器中提供更好的 GraphQL 语言支持。希望本文可以帮助到前端开发者，并引起更多人对 GraphQL 技术的关注。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedae6fb5cbfe1ea0610e47