tanstack-seolisted

# TanStack SEO Complete SEO implementation for TanStack Router / TanStack Start projects. Nine layers covering crawlability, social sharing, structured data, and AI discoverability. ## Dependencies ```bash # OG image generation (server-side only) bun add satori @resvg/resvg-js ``` No other SEO-specific dependencies. Everything uses TanStack Router's built-in `head()` API and server route handlers. ## Architecture ``` src/ ├── lib/ │ ├── seo.ts # Centralized config, meta helpers, JSON-LD generators │ ├── og-image.tsx # Satori + Resvg OG image generator (JSX → SVG → PNG) │ └── brand/index.ts # Brand constants (name, description, social, keywords) ├── routes/ │ ├── __root.tsx # Base HTML: charset, viewport, favicons, default OG, site-wide JSON-LD │ ├── og[.]png.ts # Server handler: GET /og.png?title=...&description=... │ ├── sitemap[.]xml.ts # Dynamic XML sitemap │ ├── llms[.]txt.ts # Concise site summary for AI crawlers │ ├── llms-full[.]txt.ts # Full content dump for AI crawlers │ └── (every route) # Per-route head() with title, description, canonical, OG, JSON-LD └── public/ ├── robots.txt # Crawl rules + sitemap reference ├── site.webmanifest # PWA manifest ├── favicon.svg/.png/.ico └── apple-touch-icon.png ``` ## Setup Workflow ### 1. Create Brand Config Create `src/lib/brand/index.ts`: ```typescript export const brand = { name: "Your App", shortNa