Lee y renderiza lo que publicas desde un sitio Nuxt con @hollware/nuxt, por un service binding o un token de lectura, con vistas previas e imágenes listas.

Nuxt

@hollware/nuxt es un módulo de Nuxt: composables que leen el contenido publicado, componentes que lo renderizan, vistas previas de borradores y una caché que Hollware purga cuando publicas.

npm install @hollware/nuxt

Configúralo

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@hollware/nuxt'],
  hollware: { site: 'my-site' },
  nitro: { preset: 'cloudflare_module', cloudflare: { deployConfig: true, nodeCompat: false } },
})

En Cloudflare, vincula tu Worker de Hollware en el wrangler.jsonc del sitio, y el módulo lee por ahí, sin red y sin token:

"services": [{ "binding": "HOLLWARE", "service": "my-cms", "entrypoint": "Hollware" }]

En cualquier otro lugar, pon en hollware.url la dirección de tu Hollware y un token de lectura (npx hollware token create --read) en NUXT_HOLLWARE_TOKEN. El token se queda en el servidor: las páginas leen por las rutas /_hollware/ del propio sitio.

Muestra una entrada

<script setup lang="ts">
const route = useRoute()
const { data } = await useHollwareEntry('blog', 'es', route.params.slug as string)
</script>

<template>
  <article v-if="data">
    <h1>{{ data.entry.frontmatter.title }}</h1>
    <HollwareImage :entry="data.entry" field="img" />
    <HollwareContent :entry="data.entry" :components="{ callout: Callout }" />
  </article>
</template>

<HollwareContent> renderiza la entrada desde el documento que Hollware guardó al escribirla: ningún parser de Markdown llega a la página. components asigna los componentes de tus entradas (::callout) a tus propios componentes de Vue; todo lo demás se renderiza como su etiqueta. Sus imágenes llegan con su srcset, sizes, width y height.
<HollwareImage> renderiza la imagen que guarda un campo del frontmatter, como una portada, con su alt, su tamaño y las copias que Hollware hizo de ella. Cualquier atributo que le des gana: <HollwareImage :entry field="img" loading="lazy" sizes="50vw" />.

Una entrada que no está publicada responde un 404.

Listas, traducciones y el sitio

<script setup lang="ts">
const { data } = await useHollwareEntries('blog', { locale: 'es', limit: 10 })
</script>

<template>
  <ul>
    <li v-for="post in data?.entries" :key="post.id">
      <HollwareImage :entry="post" field="img" loading="lazy" />
      <NuxtLink :to="`/blog/${post.slug}/`">{{ post.frontmatter.title }}</NuxtLink>
    </li>
  </ul>
</template>

Composable	Entrega
`useHollwareEntry(collection, locale, slug)`	una entrada publicada, con su documento
`useHollwareEntries(collection, { locale, tag, limit, cursor })`	una página de entradas publicadas, de la más nueva a la más antigua
`useHollwareTranslations(collection, group)`	las entradas de un grupo de traducción
`useHollwareSite()`	el sitio: sus locales y colecciones
`useHollware(event)` (servidor)	el lector mismo, para rutas propias

Los campos que tu colección deja a Hollware, como una fecha o el tiempo de lectura, llegan llenos en el frontmatter (Configura tu contenido).

Vistas previas

Vista previa en el sitio, en el admin, abre la página de la entrada con un enlace firmado solo para esa entrada, válido por una hora. El módulo cambia el enlace por una cookie HttpOnly, lee la última revisión de la entrada, borrador incluido, y no deja que nada guarde lo que responde. Necesita la url del sitio en el admin, en Sitio.

Caché

hollware.cache: 'purge' guarda las páginas de tu sitio en Workers Cache y deja que Hollware las purgue, por etiqueta, en cuanto publicas. Consulta Caché.

Cada página lleva <meta name="generator" content="Hollware">; hollware.generator: false lo quita.

Un sitio completo

examples/nuxt-blog en el repositorio es un blog en Nuxt sobre un Worker que lee el playground por un service binding, con vistas previas.