Skip to content

Inicio Rápido

Esta guía te ayudará a empezar en menos de 5 minutos.

Instalación Rápida

  1. Instala las dependencias
bash
npm install
  1. Inicia el servidor de desarrollo
bash
npm run docs:dev
  1. Abre tu navegador

Visita http://localhost:5173 para ver tu documentación en acción.

Tu Primera Página

Las páginas en VitePress son archivos Markdown. Cada archivo .md en el directorio docs/ se convierte en una página HTML.

Ejemplo Básico

Crea un nuevo archivo docs/mi-pagina.md:

markdown
# Mi Primera Página

Este es el contenido de mi primera página.

## Subtítulo

Puedes usar todas las características de Markdown:

- Listas
- **Negrita**
- *Cursiva*
- [Enlaces](https://vitepress.dev)

Usando Componentes Vue

VitePress te permite usar componentes Vue directamente en Markdown:

vue
<script setup>
import { ref } from 'vue'

const count = ref(0)
</script>

# Mi Contador

<button @click="count++">Contador: {{ count }}</button>

Contenedores Personalizados

VitePress incluye contenedores especiales para destacar información:

Consejo

Este es un consejo útil

Advertencia

Ten cuidado con esto

Peligro

Esto es crítico

Haz clic para ver más

Contenido oculto que se puede expandir

Bloques de Código

VitePress soporta resaltado de sintaxis para múltiples lenguajes:

javascript
// JavaScript
function hello() {
  console.log('Hello, VitePress!')
}
python
# Python
def hello():
    print("Hello, VitePress!")
bash
# Bash
echo "Hello, VitePress!"

Resaltado de Líneas

Puedes resaltar líneas específicas:

js
export default {
  name: 'MyComponent', // línea resaltada
  props: {
    // estas líneas
    // también están
    // resaltadas
  }
}

Tablas

CaracterísticaDescripción
MarkdownSintaxis simple y clara
Vue 3Componentes modernos
ViteDesarrollo ultrarrápido

Emoji 🎉

Puedes usar emojis en tu contenido: 🚀 ⭐ 🔥

Siguiente Paso

Ahora que conoces lo básico, aprende más sobre:

Documentación del proyecto