首先安装GraphQL语法高亮插件，通过Package Control搜索并安装GraphQL或GraphQL Syntax；然后安装LSP插件，配置LSP使用GraphQL Language Service，并在项目根目录创建包含schemaPath和endpoint的.graphqlconfig文件；最后推荐安装LSP-graphql、Apollo GraphQL和AutoFileName插件以增强功能，完成配置后即可在.gql或.graphql文件中获得语法高亮与智能补全。
要在Sublime Text中配置GraphQL语法高亮和自动补全，需要安装合适的插件并进行简单设置。以下是具体操作步骤，帮助你快速实现GraphQL支持。
安装GraphQL语法高亮插件
Sublime Text默认不支持GraphQL，需通过Package Control安装第三方插件：
- 打开Sublime Text，按下 Ctrl+Shift+P（Mac为Cmd+Shift+P）调出命令面板
- 输入“Install Package”，选择“Package Control: Install Package”
- 搜索并安装 GraphQL（通常由 joshbuddy 提供）或 GraphQL Syntax
安装完成后，.graphql 或 .gql 文件会自动启用语法高亮。也可以手动切换：点击右下角语言模式 → Open all with current extension as… → 选择 GraphQL。
启用自动补全功能
单纯语法高亮不包含智能补全。若要获得字段提示、类型检查等能力，建议结合 LSP 插件使用语言服务器：
- 先安装 LSP 插件（同样通过 Package Control 搜索 LSP 并安装）
- 配置 LSP 使用 GraphQL Language Service
- 在项目根目录添加 .graphqlconfig 文件，定义 schema 位置，例如：
{
"projects": {
"myapp": {
"schemaPath": "schema.graphql",
"extensions": {
"endpoints": {
"default": { "url": "http://localhost:4000/graphql" }
}
}
}
}
}
确保你的GraphQL服务正在运行，并且schema.graphql文件路径正确。LSP会读取该配置，提供查询字段补全、参数提示和错误检查。
推荐搭配插件提升体验
除了基础支持，以下插件可进一步优化开发效率：
- LSP-graphql：专为GraphQL设计的LSP客户端增强，部分用户需手动安装或配置路径
- Apollo GraphQL：如果你使用 Apollo Client，此插件支持 gql 标签内语法高亮与补全
- AutoFileName：辅助文件路径引用，对导入schema有帮助
基本上就这些。配置完成后，打开一个 .graphql 文件试试输入 query { }，应该能看到字段建议弹出。保持schema更新，补全才准确。整个过程不复杂但容易忽略配置细节。
