|
|
import{_ as a,c as i,ag as n,o as e}from"./chunks/framework.C1C4sYC0.js";const c=JSON.parse('{"title":"Conectando a un CMS","description":"","frontmatter":{"outline":"deep"},"headers":[],"relativePath":"es/guide/cms.md","filePath":"es/guide/cms.md","lastUpdated":1717650360000}'),t={name:"es/guide/cms.md"};function l(p,s,h,k,r,d){return e(),i("div",null,s[0]||(s[0]=[n(`<h1 id="connecting-to-a-cms" tabindex="-1">Conectando a un CMS <a class="header-anchor" href="#connecting-to-a-cms" aria-label="Permalink to "Conectando a un CMS {#connecting-to-a-cms}""></a></h1><h2 id="general-workflow" tabindex="-1">Flujo de Trabajo general <a class="header-anchor" href="#general-workflow" aria-label="Permalink to "Flujo de Trabajo general {#general-workflow}""></a></h2><p>Conectar VitePress a un CMS girará mayormente en torno a <a href="./routing#dynamic-routes">Rutas dinámicas</a>. Asegurese de entender cómo funcionan antes de proceder.</p><p>Como cada CMS funcionará de forma diferente, aqui podemos proveer apenas un flujo de trabajo genérico que requiere ser adaptado para cada escenario específico.</p><ol><li><p>Si su CMS exige autenticación, cree un archivo <code>.env</code> para almacenar los tokens del API y cargarlos como:</p><div class="language-js vp-adaptive-theme"><button title="Copiar código" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// posts/[id].paths.js</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { loadEnv } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> 'vitepress'</span></span>
|
|
|
<span class="line"></span>
|
|
|
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> env</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> loadEnv</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, process.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">cwd</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">())</span></span></code></pre></div></li><li><p>Obtenga los datos necesarios del CMS y aplique formato en paths de datos apropiados:</p><div class="language-js vp-adaptive-theme"><button title="Copiar código" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> async</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> paths</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> // use la biblioteca del cliente CMS respectiva si es necesario</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">await</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> fetch</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'https://my-cms-api'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> headers: {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> // token caso necesario</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> })).</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">json</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">()</span></span>
|
|
|
<span class="line"></span>
|
|
|
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> data.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">map</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">entry</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> params: { id: entry.id, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/* título, autores, data, etc. */</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> content: entry.content</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> })</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div></li><li><p>Presente el contenido en la página:</p><div class="language-md vp-adaptive-theme"><button title="Copiar código" class="copy"></button><span class="lang">md</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold;"># {{ $params.title }}</span></span>
|
|
|
<span class="line"></span>
|
|
|
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> por {{ $params.author }} en {{ $params.date }}</span></span>
|
|
|
<span class="line"></span>
|
|
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"><!-- @content --></span></span></code></pre></div></li></ol><h2 id="integration-guides" tabindex="-1">Guias de Integración <a class="header-anchor" href="#integration-guides" aria-label="Permalink to "Guias de Integración {#integration-guides}""></a></h2><p>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 aqui!</p>`,7)]))}const g=a(t,[["render",l]]);export{c as __pageData,g as default};
|
