Astro Starlight site, source under src/content/docs/.
cd docs
npm install
npm run dev # http://localhost:4321npm run build # outputs to docs/dist
npm run preview # serve the built site locallydocs/
├── astro.config.mjs # Site title, sidebar, theme
├── src/
│ ├── content.config.ts # Starlight content collection
│ ├── content/docs/ # All markdown / mdx pages
│ │ ├── index.mdx
│ │ ├── getting-started/
│ │ ├── concepts/
│ │ ├── guides/
│ │ └── reference/
│ └── styles/custom.css
└── package.json
Pages are plain Markdown (.md) with Starlight's frontmatter:
---
title: Page title
description: Shown in search and as the meta description.
---The MDX landing page (index.mdx) imports Starlight components for hero +
card grid layouts.
-
Drop a new
.md(or.mdx) undersrc/content/docs/<section>/. -
Add an entry to the matching sidebar group in
astro.config.mjs:{ label: 'My new page', slug: '<section>/<filename>' }
-
npm run devpicks it up immediately.