FM Solo Starter

A minimal Astro starter built to the Frontmatter Solo contract. Start here and your first render pack build should succeed without surprises.

---

Structure

src/
├─ components/      — Solo-compatible components (literal props only)
├─ layouts/         — Base layout (one per page)
├─ pages/           — index, contact, showcase, 404
└─ styles/
   ├─ styles.scss   — SCSS entry point
   └─ partials/     — structured partials

public/
└─ assets/          — stable CSS and JS paths for backend handoff

---

Install

npm install
# or
pnpm install

---

Validate Solo compatibility

Before generating a render pack, check the project passes the Solo contract:

npx @withfrontmatter/solo-check

Exit 0 means you're ready. Exit 1 lists exactly what to fix.

---

Development

npm run dev

In development:

• SCSS is served via Astro (/src/styles/styles.scss)
• JS is served via Astro (/src/scripts/main.js)

This is for authoring convenience only. Production uses stable asset paths under /assets/.

---

Build

npm run build

Produces:

• compiled CSS in public/assets/css/
• minified CSS in public/assets/css/styles.min.css
• bundled JS in public/assets/js/main.js
• minified JS in public/assets/js/main.min.js
• static output in dist/

Asset paths are stable for backend handoff.

---

Generate a render pack

With Frontmatter Solo:

frontmatter solo:build --adapter twig
# or
frontmatter solo:build --adapter php

---

Styling

SCSS entry point: src/styles/styles.scss

CSS custom properties, BEM naming, global only — no scoped CSS.

To switch to plain CSS:

• move your source stylesheet to public/assets/css/styles.css
• keep the same layout references
• keep only minification in the build step

---

Solo contract

This starter follows the full Solo contract: → frontmatter.tech/docs/contract

Key rules: one layout per page, literal props only, global CSS, static images from public/.