astro-coding

astro-coding Skill

Smart, context-aware implementation patterns for Astro and Starlight development. Provides the knowledge needed to write high-quality, standards-compliant Astro code.

Purpose

The astro-coding skill is a knowledge provider that supplies Astro-specific coding patterns, critical rules, and best practices. It uses a tiered loading strategy to minimize token usage while ensuring all critical rules are always available.

Tiered Loading Strategy

Tier 1: Critical Rules (ALWAYS LOADED - ~100 tokens)

The non-negotiable rules that prevent breaking errors. Loaded for every Astro/Starlight task.

Source: ${CLAUDE_PLUGIN_ROOT}/knowledge-base/critical-rules.md

Contains:

1. File extensions in imports (.astro, .ts, .js)
2. Correct module prefixes (astro:content not astro/content)
3. Use class not className in .astro files
4. Async operations in frontmatter only
5. Never expose SECRET_* client-side
6. Type all component Props interfaces
7. Define getStaticPaths() for dynamic routes
8. Don't access Astro.params inside getStaticPaths()
9. Use proper collection types (CollectionEntry<'name'>)
10. Validate XSS risk with set:html

Tier 2: Common Patterns (CONTEXT-LOADED - ~400 tokens)

Pattern-specific knowledge loaded based on task type detection.

Sources:

• ${CLAUDE_PLUGIN_ROOT}/knowledge-base/astro-patterns.md - Core Astro patterns
• ${CLAUDE_PLUGIN_ROOT}/knowledge-base/error-catalog.md - 100+ error patterns indexed by symptom
• ${CLAUDE_PLUGIN_ROOT}/knowledge-base/starlight-guide.md - Starlight-specific patterns

Load based on keywords:

• "component" → Component patterns, TypeScript patterns
• "page" or "route" → Routing patterns, dynamic routes, getStaticPaths
• "collection" or "content" → Content collections, schemas, queries
• "config" or "integration" → Configuration patterns
• "starlight" → Starlight patterns, sidebar, components
• "error" or "fix" or "debug" → Error catalog for diagnostic help