{"id":47975,"library":"graphql-voyager","title":"GraphQL Voyager","description":"Interactive visual graph explorer for any GraphQL API. Current stable version is 2.1.0, supporting GraphQL >=16.5.0 and React >=18.0.0. Features include interactive graph visualization, type documentation panel, Relay skip option, and custom root type selection. Released as middleware for Express, Hapi, Koa, and Fastify, or as a standalone React component. Differentiated from alternatives like GraphiQL by focusing on visual schema exploration rather than query building.","status":"active","version":"2.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/graphql-kit/graphql-voyager","tags":["javascript","typescript"],"install":[{"cmd":"npm install graphql-voyager","lang":"bash","label":"npm"},{"cmd":"yarn add graphql-voyager","lang":"bash","label":"yarn"},{"cmd":"pnpm add graphql-voyager","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency for introspection","package":"graphql","optional":false},{"reason":"peer dependency for UI rendering","package":"react","optional":false}],"imports":[{"note":"ESM-only since v2. Voyager is a React component.","wrong":"const Voyager = require('graphql-voyager')","symbol":"Voyager","correct":"import { Voyager } from 'graphql-voyager'"},{"note":"Named export, not default. Works with Express only.","wrong":"import voyagerMiddleware from 'graphql-voyager/middleware'","symbol":"express middleware","correct":"import { express as voyagerMiddleware } from 'graphql-voyager/middleware'"},{"note":"init is a named export for standalone usage.","wrong":"import init from 'graphql-voyager'","symbol":"init","correct":"import { init } from 'graphql-voyager'"}],"quickstart":{"code":"import React from 'react';\nimport { Voyager } from 'graphql-voyager';\nimport 'graphql-voyager/dist/voyager.css';\n\nfunction App() {\n  return (\n    <Voyager\n      introspection={fetch('https://api.example.com/graphql', {\n        headers: { Authorization: process.env.AUTH_TOKEN ?? '' }\n      }).then(res => res.json())}\n      displayOptions={{\n        skipRelay: true,\n        sortByAlphabet: true\n      }}\n    />\n  );\n}","lang":"typescript","description":"Basic React integration: import component, CSS, and pass introspection function."},"warnings":[{"fix":"Use import syntax or dynamic import().","message":"ESM-only in v2; CommonJS require() will fail.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Pass introspection as object or Promise-returning function.","message":"Voyager component properties like 'introspection' as function deprecated in v2.1? (Check docs).","severity":"deprecated","affected_versions":">=2.0.0"},{"fix":"Install manually: npm install graphql react.","message":"Peer dependencies graphql >=16.5.0 and react >=18.0.0 are required but not auto-installed.","severity":"gotcha","affected_versions":">=2.0.0"},{"fix":"Use Voyager component for React apps.","message":"The 'init' helper from standalone UMD bundle is not directly importable in ESM; use Voyager component instead.","severity":"deprecated","affected_versions":">=1.0.0"}],"env_vars":null,"search_vec":"'16.5.0':18 '18.0.0':21 '2.1.0':15 'altern':55 'api':10 'build':67 'compon':52 'current':11 'custom':34 'differenti':53 'document':28 'explor':6,63 'express':42 'fastifi':46 'featur':22 'focus':59 'graph':5,25 'graphiql':57 'graphql':1,9,17 'hapi':43 'includ':23 'interact':3,24 'javascript':68 'koa':44 'like':56 'middlewar':40 'option':32 'panel':29 'queri':66 'rather':64 'react':20,51 'relay':30 'releas':38 'root':35 'schema':62 'select':37 'skip':31 'stabl':12 'standalon':50 'support':16 'type':27,36 'typescript':69 'version':13 'visual':4,26,61 'voyag':2","created_at":"2026-06-07T16:54:17.440031+00:00","updated_at":"2026-06-07T16:54:17.440031+00:00","problems":[{"fix":"Use: import { express as voyagerMiddleware } from 'graphql-voyager/middleware'","cause":"Missing import path or incorrect middleware name.","error":"Cannot find module 'graphql-voyager/middleware'"},{"fix":"Change to import statement: import { Voyager } from 'graphql-voyager'","cause":"Using CommonJS require() with ESM-only package.","error":"export 'Voyager' (imported as 'Voyager') was not found in 'graphql-voyager'"},{"fix":"Ensure introspection prop is a function that returns a promise, or an object.","cause":"Passing string instead of function or object.","error":"Uncaught TypeError: introspection is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/graphql-kit/graphql-voyager#readme","github":"https://github.com/graphql-kit/graphql-voyager","docs":null,"changelog":null,"pypi":null,"npm":"graphql-voyager","openapi_spec":null,"status_page":null,"smithery":null,"categories":["devops"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}