# Indicación para crear un sitio SEO estático con Astro

> Indicación lista para copiar y pegar para crear un sitio estático Astro completamente optimizado con colecciones de contenido, mapa del sitio, imágenes OG y TypeScript.

**Type:** Prompt  
**Tools:** Cursor, Claude Code, Codex, Windsurf  
**Stack:** Astro, TypeScript, Tailwind  
**Difficulty:** medium  
**Updated:** 2026-06-08

---

Entrégueselo a su agente para crear un sitio estático Astro listo para producción con colecciones de contenido, Tailwind v4, meta SEO, mapa del sitio e imágenes OG por página, sin que invente integraciones incompatibles ni omita etiquetas canónicas.

## Indicación principal

```txt title="Main Prompt"
You are scaffolding a new Astro static site. Use Astro 5, TypeScript strict mode,
and Tailwind CSS v4 (via @tailwindcss/vite — NOT the legacy @astrojs/tailwind integration).

Requirements:
- Initialize with `bun create astro@latest` defaults, then layer in:
  - A `src/content/blog/` collection with a Zod schema (title, description, pubDate, tags).
  - A shared `<BaseLayout>` with `<head>` containing: canonical URL, og:title, og:description,
    og:image (per-page), twitter:card, and the Astro `<ViewTransitions />` component.
  - `@astrojs/sitemap` integration configured with `customPages` for any dynamic routes.
  - A `public/robots.txt` that disallows `/api/` and allows everything else.
  - A `/blog/[slug].astro` dynamic route that renders MDX blog posts.
  - A `/tags/[tag].astro` route that filters posts by tag.
  - Tailwind applied globally via `src/styles/global.css` imported in BaseLayout.
- All components must be `.astro` — no React unless explicitly asked.
- Export a typed `getStaticPaths` for every dynamic route.
- Do NOT install `@astrojs/react`, `next`, or any SSR adapter — this is a static build.

Stop after listing all files you plan to create or modify. Wait for my approval before writing any code.
```

## Notas de implementación

- Las colecciones de contenido de Astro 5 usan `defineCollection` en `src/content.config.ts`, no la ruta antigua `src/content/config.ts` — confirme que el agente usa la ubicación correcta.
- Tailwind v4 se distribuye como un plugin de Vite; el patrón antiguo `integrations: [tailwind()]` en `astro.config.ts` está obsoleto y causará un error en tiempo de ejecución.
- `getStaticPaths` debe devolver objetos `{ params, props }`; el agente a veces devuelve cadenas simples.

## Cambios esperados en archivos

```txt
astro.config.ts                          (new)
src/content.config.ts                    (new)
src/layouts/BaseLayout.astro             (new)
src/pages/index.astro                    (new)
src/pages/blog/[slug].astro              (new)
src/pages/tags/[tag].astro              (new)
src/styles/global.css                    (new)
public/robots.txt                        (new)
package.json                             (edited)
tsconfig.json                            (edited)
```

## Criterios de aceptación

- `bun run build` termina con código 0 y sin errores de tipo.
- Cada página de publicación de blog incluye una URL canónica única y `og:image` en el HTML renderizado.
- Se genera `/sitemap-index.xml` y contiene todas las URL de las publicaciones del blog.
- Existe `/robots.txt` y no permite `/api/`.

## Comandos de prueba

```bash
bun run build
bun run preview
curl -s http://localhost:4321/sitemap-index.xml | grep '<loc>'
curl -s http://localhost:4321/robots.txt
bun run typecheck
```

## Errores comunes de la IA

- Instalar el obsoleto `@astrojs/tailwind` en lugar de `@tailwindcss/vite`.
- Colocar `content.config.ts` en `src/content/config.ts` (ruta antigua de Astro 4).
- Olvidar llamar a `getCollection('blog')` dentro de `getStaticPaths` — devolviendo un array vacío.
- Añadir `output: 'server'` a `astro.config.ts`, lo que rompe la exportación estática.

## Indicación correctiva

```txt title="Fix Prompt"
The build failed. Check for these issues in order:
1. Tailwind: remove `@astrojs/tailwind` from integrations and add `@tailwindcss/vite` to the
   `vite.plugins` array in astro.config.ts.
2. Content config: the file must be at `src/content.config.ts` (not `src/content/config.ts`).
3. `getStaticPaths`: each entry must be `{ params: { slug }, props: { post } }`.
Fix only the broken items. Show me the corrected diff.
```