# Configuración de GraphQL (/es/api-playground/graphql-setup)

<!-- agent-signals: reading_time_min: 3 · est_tokens: 1116 · updated: 2026-07-30 -->
Related: [Playground](/es/api-playground/overview.md), [Configuración de OpenAPI](/es/api-playground/openapi-setup.md), [Tipos de datos complejos](/es/api-playground/complex-data-types.md), [Agregar ejemplos de SDK](/es/api-playground/adding-sdk-examples.md), [Gestionar la visibilidad de páginas](/es/api-playground/managing-page-visibility.md), [Respuestas múltiples](/es/api-playground/multiple-responses.md)

<div id="add-a-graphql-schema">
  ## Agrega un esquema de GraphQL [#agrega-un-esquema-de-graphql]
</div>

Para crear páginas para tu API de GraphQL, necesitas un esquema de GraphQL válido en formato SDL (Schema Definition Language). Almacena el esquema en tu repositorio de documentación o alójalo en una URL HTTPS que Mintlify pueda obtener.

```graphql title="schema.graphql"
"An object with a stable identifier."
interface Node {
  id: ID!
}

type Organization implements Node {
  id: ID!
  name: String!
}

type Query {
  organization(id: ID!): Organization
}
```

<div id="auto-populate-graphql-pages">
  ## Generar automáticamente páginas de GraphQL [#generar-automáticamente-páginas-de-graphql]
</div>

Para generar automáticamente páginas para cada consulta, mutación y tipo de tu esquema, agrega una propiedad `graphql` a una pestaña en tu `docs.json`. Mintlify analiza el esquema y crea una página para cada operación y tipo con nombre.

<CodeGroup>
  <CodeBlockTabs defaultValue="Local file" groupId="custom-directory+local-file+remote-url">
    <CodeBlockTabsList>
      <CodeBlockTabsTrigger value="Local file">
        Local file
      </CodeBlockTabsTrigger>

      <CodeBlockTabsTrigger value="Remote URL">
        Remote URL
      </CodeBlockTabsTrigger>

      <CodeBlockTabsTrigger value="Custom directory">
        Custom directory
      </CodeBlockTabsTrigger>
    </CodeBlockTabsList>

    <CodeBlockTab value="Local file">
      ```json  
      "navigation": {
        "tabs": [
          {
            "tab": "GraphQL API",
            "graphql": "schema.graphql"
          }
        ]
      }
      ```
    </CodeBlockTab>

    <CodeBlockTab value="Remote URL">
      ```json  
      "navigation": {
        "tabs": [
          {
            "tab": "GraphQL API",
            "graphql": "https://example.com/schema.graphql"
          }
        ]
      }
      ```
    </CodeBlockTab>

    <CodeBlockTab value="Custom directory">
      ```json  
      "navigation": {
        "tabs": [
          {
            "tab": "GraphQL API",
            "graphql": {
              "source": "schema.graphql",
              "directory": "api/graphql"
            }
          }
        ]
      }
      ```
    </CodeBlockTab>
  </CodeBlockTabs>
</CodeGroup>

La propiedad `graphql` acepta ya sea una cadena (una ruta local o una URL HTTPS) o un objeto con los siguientes campos:

<ParamField path="source" type="string">
  Una ruta local a un archivo SDL en tu repositorio de documentación o una URL HTTPS a un archivo SDL alojado. No se aceptan URL HTTP.
</ParamField>

<ParamField path="directory" type="string">
  El directorio donde se colocan las páginas generadas. El valor predeterminado es `graphql-reference`.
</ParamField>

<Note>
  Las fuentes de GraphQL solo se admiten en pestañas. Una pestaña que declara `graphql` no puede declarar también `openapi` o `asyncapi`.
</Note>

<div id="generated-pages">
  ## Páginas generadas [#páginas-generadas]
</div>

Mintlify organiza las páginas generadas en tres secciones dentro de la pestaña que configuraste:

* **Queries** — una página por cada campo de tu tipo raíz `Query`.
* **Mutations** — una página por cada campo de tu tipo raíz `Mutation`.
* **Types** — una página por cada tipo con nombre: object, input, enum, interface, union o scalar.

Cada página de operación muestra la descripción del campo, los argumentos, el tipo de retorno y enlaces a cualquier tipo referenciado. Las páginas de consultas y mutaciones también incluyen una operación de ejemplo generada, las variables requeridas y una respuesta JSON de muestra en el panel lateral (o en línea en dispositivos móviles).

Las páginas de tipos renderizan la definición del esquema en modo solo lectura, con los tipos de campo enlazados para que las personas que leen puedan navegar por el grafo.

<div id="deprecations">
  ## Deprecaciones [#deprecaciones]
</div>

Los campos y argumentos marcados con `@deprecated` en tu esquema se señalan como obsoletos en las páginas generadas. El motivo de la deprecación, cuando se proporciona, aparece junto al campo.

<div id="update-your-documentation">
  ## Actualiza tu documentación [#actualiza-tu-documentación]
</div>

Mintlify regenera las páginas de referencia de GraphQL cuando ejecutas `mint dev` o cuando envías cambios a tu repositorio de documentación. Si tu esquema está alojado en una URL HTTPS, las actualizaciones del esquema se incorporan en la siguiente compilación.