Inicio Rápido
Esta guía te ayudará a empezar en menos de 5 minutos.
Instalación Rápida
- Instala las dependencias
bash
npm install- Inicia el servidor de desarrollo
bash
npm run docs:dev- 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ística | Descripción |
|---|---|
| Markdown | Sintaxis simple y clara |
| Vue 3 | Componentes modernos |
| Vite | Desarrollo ultrarrápido |
Emoji 🎉
Puedes usar emojis en tu contenido: 🚀 ⭐ 🔥
Siguiente Paso
Ahora que conoces lo básico, aprende más sobre: