Why can I not run Playground in Gatsby 5 as it was in Gatsby 4 using GATSBY_GRAPHQL_IDE=playground gatsby develop?

Question

I'm trying to run Graphql Playground in Gatsby.

My config:

  "scripts": {
    "develop": "GATSBY_GRAPHQL_IDE=playground gatsby develop",
    "start": "gatsby develop",
    "build": "gatsby build",
    "serve": "gatsby serve",
    "clean": "gatsby clean"
  },
  "dependencies": {
    "babel-plugin-styled-components": "^2.0.7",
    "dotenv": "^16.0.3",
    "gatsby": "^5.0.0",
    "gatsby-plugin-styled-components": "^6.0.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "styled-components": "^5.3.6"
  }

I run npm run develop . But it does not work getting into playground mode.

I tried installing dotenv.

added

 require('dotenv').config({
    path: `.env.${process.env.NODE_ENV}`,
  });

to gatsby-config.js .

Then assigned GATSBY_GRAPHQL_IDE=playground into env.development .

Ran npm run develop .

Still no luck.

I also tried running simple GATSBY_GRAPHQL_IDE=playground gatsby develop . Didn't help either.

It actually worked after changing Gatsby version to ^4.21.1 and running npm install .

What could be the problem? Is Playground still present in 5.0.0?

Answer 1

Playground was removed from version 5.

From here

Removal of GraphQL Playground Maybe you didn't know, but Gatsby supported GraphQL Playground as an alternative to GraphiQL for some time now. With Gatsby 5 we've updated GraphiQL to v2 which has feature parity with GraphQL Playground. Thus we removed the GATSBY_GRAPHQL_IDE environment variable and GraphQL Playground. Visit the GraphiQL guide to learn more about GraphiQL v2.