Skip to main content
Version: v18.0.0

Editor Support

TL;DR: We have a VS Code Extension


The Relay compiler has a rich understanding of the GraphQL embedded in your code. We want to use that understanding to improve the developer experience of writing apps with Relay. So, starting in v14.0.0, the new Rust Relay compiler can provide language features directly in your code editor. This means:

Relay compiler errors surface as red squiggles directly in your editor​

Autocomplete throughout your GraphQL tagged template literals​

Hover to see type information and documentation about Relay-specific features​

@deprecated fields are rendered using strikethrough​

Click-to-definition for fragments, fields and types​

Quick fix suggestions for common errors​

Language Server​

The editor support is implemented using the Language Server Protocol which means it can be used by a variety of editors, but in tandem with this release, Terence Bezman from Coinbase has contributed an official VS Code extension.

Find it here!

Why Have a Relay-Specific Editor Extension?​

The GraphQL foundation has an official language server and VS Code extension which provides editor support for GraphQL generically. This can provide a good baseline experience, but for Relay users, getting this information directly from the Relay compiler offers a number of benefits:

  • Relay compiler errors can surface directly in the editor as β€œproblems”, often with suggested quick fixes
  • Hover information is aware Relay-specific features and directives and can link out to relevant documentation