README

GraphQL IDE Monorepo

 Security Notice: All versions of graphiql  XSS attack in cases where the GraphQL server to which the GraphiQL web app
 connects is not trusted. Learn more
 in the graphiql security docs directory

 Looking for the GraphiQL Docs?: This is the
 root of the monorepo! The full GraphiQL docs are located at
 packages/graphiql





!GitHub top language
!GitHub language count



 Overview

GraphiQL (pronounced like "graphical") is the reference implementation of this
monorepo, GraphQL IDE, an official project under the GraphQL Foundation. The
code uses the permissive MIT license.

Whether you want a simple GraphiQL IDE instance for your server, or a more
advanced web or desktop GraphQL IDE experience for your framework or plugin, or
you want to build an IDE extension or plugin, you've come to the right place!

The purpose of this monorepo is to give the GraphQL Community:

- a to-specification official language service (see:
  API Docs)
- a comprehensive LSP server and CLI service for use with IDEs
- a codemirror mode
- a monaco mode (in the works)
- an example of how to use this ecosystem with GraphiQL.
- examples of how to implement or extend GraphiQL.

 graphiql


 
 !jsDelivr hits (npm)
 !npm downloads
 !Snyk Vulnerabilities for npm package
 !npm bundle size (version)
 !npm bundle size (version)

!Screenshot of GraphiQL with Doc Explorer Open

_/ˈɡrafək(ə)l/_ A graphical interactive in-browser GraphQL IDE.
Try the live demo. We also have
a demo using our latest netlify build for
the main branch.

The GraphiQL IDE, implemented in React, currently using
GraphQL mode for CodeMirror &
GraphQL Language Service.

Learn more about
GraphiQL in packages/graphiql/README.md

 monaco-graphql


!jsDelivr hits (npm)
!npm downloads
!Snyk Vulnerabilities for npm package

Provides monaco editor with a powerful, schema-driven graphql language mode.
Uses the graphql-language-servicedirectly.

See the webpack example for a plain
javascript demo using GitHub API

 codemirror-graphql


!jsDelivr hits (npm)
!npm downloads
!Snyk Vulnerabilities for npm package

!Animated Codemirror GraphQL Completion Example

Provides CodeMirror 5 with a parser mode for GraphQL along with a live linter and
typeahead hinter powered by your GraphQL Schema. Uses the
graphql-language-service.

 cm6-graphql


!jsDelivr hits (npm)
!npm downloads
!Snyk Vulnerabilities for npm package

Provides CodeMirror 6 with a full-featured language mode for GraphQL. Uses the graphql-language-service.

 graphql-language-service


!npm downloads
!Snyk Vulnerabilities for npm package

Provides language services for
graphql-language-service-server
codemirror-graphql and
monaco-graphql. Previously published separately as
the now-retired graphql-language-service-interface,
graphql-language-service-parser, graphql-language-service-utils and
graphql-language-service-types.

 graphql-language-service-server


!npm downloads
!Snyk Vulnerabilities for npm package

Provides language services for LSP