cms.md

description	Conecta VitePress a un CMS headless usando rutas dinámicas y cargadores de datos.
outline	deep

Conectando a un CMS {#connecting-to-a-cms}

Flujo de Trabajo general {#general-workflow}

Conectar VitePress a un CMS girará mayormente en torno a Rutas dinámicas. Asegúrese de entender cómo funcionan antes de proceder.

Como cada CMS funcionará de forma diferente, aquí podemos proveer apenas un flujo de trabajo genérico que requiere ser adaptado para cada escenario específico.

1. Si su CMS exige autenticación, cree un archivo .env para almacenar los tokens del API y cargarlos como:

   // posts/[id].paths.js
   import { loadEnv } from 'vitepress'
   
   const env = loadEnv('', process.cwd())

2. Obtenga los datos necesarios del CMS y aplique formato en rutas de datos apropiados:

   export default {
     async paths() {
       // use la biblioteca del cliente CMS respectiva si es necesario
       const data = await (await fetch('https://my-cms-api', {
         headers: {
           // token si es necesario
         }
       })).json()
   
       return data.map(entry => {
         return {
           params: { id: entry.id, /* título, autores, data, etc. */ },
           content: entry.content
         }
       })
     }
   }

3. Renderice el contenido en la página:

   # {{ $params.title }}
   
   - por {{ $params.author }} en {{ $params.date }}
   
   <!-- @content -->

Guías de Integración {#integration-guides}

Se usted escribió una guía sobre cómo integrar VitePress con un CMS específico, por favor use el link "Edite esta página" abajo para enviarlo hacia aquí!