Sublime如何配置GraphQL Schema语法支持?(API定义文件)

7次阅读

graphql schema 文件无高亮是因sublime未绑定后缀,需右键「plain text」→「open all with current extension as…」选graphql;推荐用.graphql后缀,安装graphql插件即可语法高亮,验证query需graphql language service+graphql-config声明schema.json路径。

Sublime如何配置GraphQL Schema语法支持?(API定义文件)

GraphQL Schema 文件后缀没高亮?先确认文件关联

Sublime 默认不识别 .graphql.gql 为 GraphQL Schema 文件,所以打开时只是纯文本。这不是插件问题,是文件类型没绑定。

  • 右键编辑器右下角的「Plain Text」→ 选择「Open all with current extension as…」→ 搜索并选中「GraphQL」(需已安装 GraphQL 插件)
  • 如果没这个选项,说明插件没装或没生效;手动绑定:菜单栏 View → Syntax → Open all with current extension as… → GraphQL
  • 推荐统一用 .graphql 后缀,社区兼容性最好;.gql 在某些插件里支持不全

装哪个插件?GraphQL 和 GraphQL Language Service 的区别

搜「GraphQL」会看到两个主流插件:GraphQL(by prisma)和 GraphQL Language Service(by kumarharsh)。前者只做语法高亮+基础补全,后者支持 schema 联动、字段跳转、错误实时校验——但依赖本地 schema.json 或运行中的 GraphQL 服务。

  • 只要看代码:装 GraphQL 就够了,通过 Package Control 安装即可
  • 要验证 query 是否符合 schema:必须配 GraphQL Language Service + graphql-config 配置文件
  • 注意:后者在 Sublime 中需配合 SublimeLinter-contrib-graphql 才能显示 lint 错误,不是开箱即用

schema.json 怎么接入?别直接扔进项目根目录

Language Service 插件不会自动发现 schema.json,必须通过 graphql-config 声明路径。否则补全和校验全部失效。

  • 在项目根目录新建 graphql.config.yml(或 .graphqlrc),内容至少包含:
    projects:   default:     schema: ./schema.json
  • schema.json 必须是 introspection 结果(用 get-graphql-schema 或 Apollo CLI 导出),不能是 SDL 文本(如 type Query { ... }
  • 路径支持相对、绝对,但不能用环境变量或通配符;Sublime 不读取 shell 环境,$HOME 这类写法会失败

补全不工作?检查 language server 是否真在跑

装完插件不代表 language server 已启动。Sublime 里没有后台进程管理界面,出问题只能靠日志和状态栏提示。

  • 状态栏左下角出现 GraphQL LS: Ready 才算正常;若显示 Starting… 卡住,大概率是 Node.js 版本太低(需 ≥16.14)或 graphql-config 路径错
  • 补全触发条件严格:光标必须在 query / fragment 内部,且前面有 {;在字符串字面量里敲不会响应
  • 字段名补全依赖 schema 字段定义顺序,如果 schema 里用了 @deprecated 或自定义 directive,部分插件会跳过这些字段

GraphQL Schema 支持的难点不在安装,而在 schema 来源是否可信、配置路径是否被插件真实解析。很多人卡在「明明文件存在却报 schema not found」,其实只是 graphql.config.yml 放错了层级,或者用了 symlink 但插件不跟随。

text=ZqhQzanResources