Add Astro Integration

Use this skill when adding official or community integrations to an Astro project, including UI frameworks, styling tools, adapters, content tooling, and utilities.

If astro-best-practices is available, apply it alongside this skill for performance, accessibility, and hydration defaults.

Workflow

1. Classify the integration

Identify what is being added before changing anything:

• UI framework: React, Vue, Svelte, Preact, Solid
• Styling: Tailwind, UnoCSS, Sass, CSS tooling
• Deployment adapter: Netlify, Vercel, Cloudflare, Node
• Content tooling: MDX, Markdoc, CMS integrations
• Utilities: sitemap, Partytown, analytics, database helpers

This determines whether the change affects rendering mode, hydration, config shape, or build output.