`.
* Importaciones de snippets sin resolver.
Estas clases de errores causan fallos de compilación, así que corrígelos mientras escribes para evitar despliegues fallidos.
Para desactivar los diagnósticos, establece `mintlify.diagnostics.enabled` en `false`.
## Documentación al pasar el cursor
Pasa el cursor sobre un componente o una propiedad para ver qué hace y un enlace a su página en la documentación de Mintlify. Al pasar el cursor sobre un componente de snippet se previsualiza el contenido del archivo de snippet.
## Ir a la definición
Mantén presionado
CMD (macOS) o
CTRL (Windows) y haz clic para navegar a la definición de:
* Componentes de snippet.
* Rutas de importación.
* Atributos `href` y `src` que apuntan a páginas locales.
La extensión encuentra la raíz de tu documentación subiendo desde el archivo abierto hasta encontrar `docs.json`, por lo que las importaciones absolutas como `/snippets/example.mdx` se resuelven correctamente. El proyecto detectado aparece en la barra de estado. Para comprobar qué raíz está usando la extensión, ejecuta **Mintlify: Show detected docs root** desde la paleta de comandos.
## Plegado
Usa los chevrones del margen para plegar regiones de una página:
* Regiones de etiquetas de componentes y HTML, como `
…`.
* Secciones de encabezados.
* Frontmatter.
* Bloques de código.
* Comentarios JSX.
## Validación de configuración
La extensión valida `docs.json` contra el [esquema de Mintlify](https://mintlify.com/docs.json).
## Previsualización en tu editor
Abre un archivo `.mdx` y selecciona el icono de previsualización en la barra de título del editor, o haz clic derecho en el archivo y selecciona **Preview Mintlify**. Un panel de previsualización se abre junto a tu editor y renderiza la página.
La barra de herramientas de la previsualización tiene botones de atrás, adelante y recargar, un cuadro de dirección y un interruptor **Follow editor**. Escribe una ruta como `/quickstart` en el cuadro de dirección y presiona
Enter para navegar a esa página. Con **Follow editor** activado, la previsualización cambia de página a medida que cambias de archivo en tu editor.
La previsualización en el editor se renderiza en un iframe, por lo que la búsqueda del navegador y las herramientas de desarrollo no pueden acceder a ella. Selecciona el botón **Open in browser** en la barra de herramientas de la previsualización, o ejecuta **Mintlify: Open preview in browser**, para abrir la página en tu navegador.
Las previsualizaciones en el editor requieren la [CLI de Mintlify](/docs/es/cli/install). El servidor de previsualización se ejecuta en el puerto `3939` de forma predeterminada para no entrar en conflicto con aplicaciones en el puerto 3000. Cambia el puerto con la configuración `mintlify.preview.port`.
La URL del servidor en ejecución aparece en la barra de estado. Selecciónala para detener el servidor, o ejecuta **Mintlify: Stop preview server**.
Para ver la salida del proceso `mint dev` subyacente, abre el canal de salida **Mintlify Preview**.
Usa la previsualización en el editor mientras escribes páginas individuales, y [`mint dev`](/docs/es/cli/preview) en un navegador cuando quieras probar la navegación, la búsqueda o la autenticación en todo tu sitio.
## Envolver contenido en componentes
La extensión incluye snippets que envuelven el texto seleccionado en un componente, en lugar de insertar un componente vacío para que lo completes.
Para usarlos, selecciona el contenido que quieres envolver, luego ejecuta **Snippets: Surround With** desde la paleta de comandos y elige un componente. Hay snippets disponibles para `AccordionGroup`, `CardGroup`, `CodeGroup`, `Expandable`, `Frame`, `RequestExample`, `ResponseExample` y bloques de código delimitados.
## Configuración
| Configuración | Valor predeterminado | Descripción |
| ----------------------------------------- | -------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `mintlify.diagnostics.enabled` | `true` | Reporta componentes desconocidos, propiedades desconocidas, propiedades requeridas faltantes e importaciones de snippets sin resolver. |
| `mintlify.warnAboutConflictingExtensions` | `true` | Advierte cuando tienes otra extensión MDX instalada junto a la extensión Mintlify MDX. |
| `mintlify.preview.command` | `mint dev --no-open` | Comando usado para iniciar el servidor de previsualización, ejecutado desde la raíz de tu proyecto. |
| `mintlify.preview.followEditor` | `true` | Cambia la previsualización a la página del editor activo cuando cambias de archivo. También se puede alternar desde la barra de herramientas de la previsualización. |
| `mintlify.preview.port` | `3939` | Puerto del servidor de previsualización. Se agrega al comando de previsualización como `--port` a menos que ese comando ya establezca uno. |
`mintlify.preview.command` es una configuración de usuario, por lo que un espacio de trabajo no puede sobrescribirla. Esto evita que un repositorio clonado ejecute un comando arbitrario en tu máquina cuando abres una previsualización.
## Comandos
Ejecútalos desde la paleta de comandos:
| Comando | Descripción |
| ------------------------------------- | --------------------------------------------------------- |
| **Mintlify: Preview Mintlify** | Abre el panel de previsualización para el archivo actual. |
| **Mintlify: Stop preview server** | Detiene el servidor de previsualización en ejecución. |
| **Mintlify: Open preview in browser** | Abre la página previsualizada en tu navegador. |
| **Mintlify: Show detected docs root** | Muestra qué archivo `docs.json` resolvió la extensión. |
| **Mintlify: Open component docs** | Abre la documentación del componente en tu cursor. |
| **Mintlify: Restart language server** | Reinicia el servidor de lenguaje. |
## Extensiones en conflicto
Otras extensiones MDX proporcionan su propio resaltado de sintaxis y funciones de lenguaje para archivos `.mdx`, que entran en conflicto con esta extensión. Desactiva otras extensiones MDX para evitar sugerencias duplicadas y resaltado inconsistente.
Para el formato de código, usa [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) junto con esta extensión o ejecuta [`mint format`](/docs/es/cli/commands#mint-format).
## Solución de problemas
La extensión resuelve los componentes en relación con la raíz de tu documentación. Ejecuta **Mintlify: Show detected docs root** para confirmar que encontró el archivo `docs.json` correcto. Si la raíz es incorrecta o falta, abre la carpeta que contiene tu archivo `docs.json` como tu espacio de trabajo.
Si la raíz es correcta, ejecuta **Mintlify: Restart language server**.
Es probable que otra extensión MDX también esté activa. Abre la vista de Extensiones, busca `mdx` y desactiva cualquier otra extensión MDX en este espacio de trabajo.
Abre el canal de salida **Mintlify Preview** para ver el error de `mint dev`.
* `could not run "mint dev --no-open"`: La CLI no está instalada. Instálala con `npm i -g mint`.
* `Trust the workspace first`: Confía en el espacio de trabajo a través de **Manage Workspace Trust**.
* `no docs.json found above this file`: Abre la carpeta que contiene tu archivo `docs.json` como tu espacio de trabajo.
* `Invalid docs.json`: Ejecuta [`mint validate`](/docs/es/cli/commands#mint-validate) para encontrar el error de configuración.
Las rutas de importación absolutas se resuelven desde la raíz de tu documentación, no desde tu archivo. Confirma que la ruta coincide con la ubicación del archivo de snippet en relación con tu archivo `docs.json`, y que la raíz detectada es correcta.
## Related topics
- [Mintlify CLI](/docs/es/cli/index.md)
- [Instalar la CLI](/docs/es/cli/install.md)
- [Previsualización local](/docs/es/cli/preview.md)