打开.graphql文件仍是白底黑字,是因为文件扩展名未绑定GraphQL语法,需手动在状态栏点击“Open all with current extension as→GraphQL”;JS/TS中gql模板字符串高亮需启用"enable_jsx_graphql": true且gql为全局函数。

打开 .graphql 文件还是白底黑字?先看右下角状态栏
这不是插件没装,而是文件扩展名根本没绑定到 GraphQL 语法。Sublime Text 默认不接管 .graphql 或 .gql 后缀,装完插件也照样显示 Plain Text —— 这是常态,不是异常。
实操步骤很简单:
- 打开任意一个
schema.graphql文件 - 点击右下角状态栏当前语言名(大概率是
Plain Text) - 选
Open all with current extension as…→ 再选GraphQL - 如果项目里还有
.gql文件,对它重复一次该操作
完成后状态栏必须显示 GraphQL,且 # 注释、type、query、花括号和字段名要有明显颜色区分,才算真正生效。
JS/TS 里写 schema 定义为什么没高亮?enable_jsx_graphql 必须开
Sublime 的 GraphQL 插件默认只解析独立 .graphql 文件,JS/TS 中的字符串(比如 const schema = `type Query { ... }`)不会自动识别。要让它工作,得靠插件的 JSX 上下文支持,且配置必须显式开启。
打开 Preferences → Package Settings → GraphQL → Settings,确认用户设置里有:
"enable_jsx_graphql": true
注意:这个开关只对特定写法有效:
-
gql`type Query { ... }`可以触发高亮 -
graphql`...`或/* GraphQL */`type Query { ... }`也可能被识别(取决于插件版本) - 但
const s = gql``中若gql是局部变量、重命名导入(如import { graphql as gql }),插件无法推断,高亮基本失效
schema.graphql 文件本身语法错乱?检查 SDL 格式与编码
高亮失效或关键字变白,常见原因不是写错了,而是文件不符合插件对 SDL(Schema Definition Language)的解析预期。
关键约束如下:
- 必须用 UTF-8 编码,且不能含 BOM(Windows 记事本另存为时容易带 BOM)
- 只允许
#开头的注释,禁止//或/* */ - 不能混用缩进:同一层级字段必须统一用空格或 Tab,
extend type Query {后换行缩进不一致会直接导致后续解析中断 - 新特性如
@defer、interface implements需要插件 v3.x+ 支持;老版本(v2.x 及以下)会跳过整块语法,表现为“突然变白”
临时验证方法:把出问题的片段单独新建一个 .graphql 文件,看是否高亮正常——能则说明是上下文干扰,不是语法错误。
LSP 补全不工作?schema.graphql 和 graphql.config.yml 必须配对放对位置
语法高亮只是基础,补全和类型校验依赖 LSP-graphql 语言服务器,而它只认两样东西:schema.graphql(SDL 格式)和项目根目录下的 graphql.config.yml。
常见静默失败点:
-
schema.graphql必须是纯 SDL 文本(type Query { ... }),不是schema.json—— LSP-graphql 完全不读 introspection JSON -
graphql.config.yml必须放在你通过Project → Add Folder to Project加入的项目根目录下,子目录或任意其他路径都不认 - 配置中
schema字段写的是相对路径,例如schema: ./src/schema.graphql,路径错或文件不可读,LSP 不报错,只会退化为纯高亮
最易忽略的一点:LSP-graphql 依赖 LSP 主框架,光装它自己没用;必须先装 LSP 包,再装 LSP-graphql,否则连启动日志都不会输出。


















