Slidev

Personalizaciones

Slidev es totalmente personalizable, desde el estilo hasta la configuración de las herramientas. Permite configurar las herramientas que funcionan "detrás de las escenas" (Vite, Windi CSS, Monaco, etc.)

Configuración de Frontmatter

Puedes configurar Slidev en el frontmatter de tu primera diapositiva, a continuación se muestra el valor por defecto de cada opción.

---
# ID del tema o nombre del paquete
# Para más información: https://es.sli.dev/themes/use.html

theme: 'default'
# título de tu diapositiva, se deducirá automáticamente de la primera cabecera si no se especifica
title: 'Slidev'
# titleTemplate for the webpage, `%s` will be replaced by the page's title
titleTemplate: '%s - Slidev'
# information for your slides, can be a markdown string
info: false
# activa el modo de presentador, puede ser un booleano, 'dev' o 'build'
presenter: true
# descarga habilitada de pdf en la compilación de SPA, también puede ser una url personalizada
download: false
# nombre del archivo exportado
exportFilename: 'slidev-exported.pdf'
# resaltador de sintaxis, puede ser 'prisma' o 'shiki'
highlighter: 'prism'
# muestra el número de línea
lineNumbers: false
# activa el editor monaco, puede ser booleano, 'dev' o 'build'
monaco: 'dev'
# download remote assets in local using vite-plugin-remote-assets, can be boolean, 'dev' or 'build'
remoteAssets: false
# controls whether texts in slides are selectable
selectable: true
# enable slide recording, can be boolean, 'dev' or 'build'
record: 'dev'

# forzar el esquema de colores para las diapositivas, podría ser 'auto', 'light', o 'dark'
colorSchema: 'auto'
# modo del router para vue-router, podría ser "history" o "hash"
routerMode: 'history'
# relación de aspecto de las diapositivas
aspectRatio: '16/9'
# ancho real del lienzo, unidad en px
canvasWidth: 980
# used for theme customization, will inject root styles as `--slidev-theme-x` for attribute `x`
themeConfig:
  primary: '#5d8392'

# favicon, puede ser una ruta local o una URL
favicon: 'https://cdn.jsdelivr.net/gh/slidevjs/slidev/assets/favicon.png'
# URL del servidor de PlantUML para renderizar diagramas
plantUmlServer: 'https://www.plantuml.com/plantuml'
# fuentes que se importarán desde Google Fonts
# Leer más: https://es.sli.dev/custom/fonts
fonts:
  sans: 'Roboto'
  serif: 'Roboto Slab'
  mono: 'Fira Code'

# frontmatter aplicado por defecto a todas las diapositivas
defaults:
  layout: 'default'
  # ...

#  opciones de dibujado
# Para leer más: https://es.sli.dev/guide/drawing.html
drawings:
  enabled: true
  persist: false
  presenterOnly: false
  syncAll: true
---

Revisa las definiciones de tipos para más opciones.

Estructura del directorio

Slidev utiliza convenciones de estructura de directorios para minimizar la superficie de configuración y hacer que las extensiones en la funcionalidad sean flexibles e intuitivas.

Consulta la sección de estructura de directorios.

Herramientas de configuración