bekahhw/astrofrontmatterrules icon
public
Published on 7/22/2025
astro-frontmatter-rules

Rules

rules:

  • name: "Astro Frontmatter Rules" description: "Guidelines for writing valid Astro frontmatter in .astro files." content: |
    1. Always place frontmatter at the very top of the file.
    2. Use triple dashes (---) to open and close the block.
    3. Only one frontmatter block per .astro file.
    4. Use frontmatter for:
      • Imports
      • Declaring constants and variables
      • Exporting metadata with export const
      • Accessing Astro.props in components
      • Async data fetching (using await)
    5. Do NOT:
      • Use DOM APIs (document, window)
      • Add client-side scripts here
    6. Everything exported becomes available in the template: Example:

      export const title = "OSS Communities";

      <h1>{title}</h1>
    7. For components, destructure props from Astro.props:

      const { heading } = Astro.props;

    8. Keep heavy logic outside frontmatter (move to utility files).