An Astro starter project set up with pnpm, Biome, Stylelint, autoprefixer, cssnano, Husky, and Astro Sitemap, plus sensible VS Code defaults and recommended workspace extensions.
- Click "Use this template" and create a new repository.
- In
astro.config.mjs
, updatesite
fromhttps://mysite.com
to your site URL. - In
src/layouts/BaseLayout.astro
, updatesiteName
to your site name. - Good to go!
Basics
- A blank Astro project with TypeScript enabled
pnpm
package management plusonly-allow pnpm
- Import aliases of
src
using~
to enable usingimport { Component } from '~/components'
- Basic meta tags and open graph tags in
layouts/BaseLayout.astro
initial-scale=1
onviewport
to prevent default mobile zoom-out- Site name displays after the page title (
Page Title · Site Name
) on pages other than the main index - smartypants smart quotes for page titles and descriptions
Styles
scss
for nested style declarations until broader native support- PostCSS
autoprefixer
for browser prefixing andcssnano
for CSS minification - Josh Comeau's reset.css
Linting and Formatting
- Linting and formatting with Biome
- Style linting with Stylelint and stylelint-config-astro
VS Code
- Format on save and on paste
- Default formatter set to Astro
- Workplace recommendations for Astro, axe Accessibility Linter, and Biome
Package.json scripts
check
— Run Astro check + Biome lint and formatcheck:fix
— Run Astro check + Biome lint and format + fix errorsstylelint
— Run Stylelintstylelint:fix
— Run Stylelint and fix errors
Husky
pnpm check
on pre-commit
Dependabot
- Weekly dependency update checks
- All GitHub Action updates grouped in a single pull request
- All patch or minor package updates grouped in a single pull request
- All major package updates created as individual pull requests
Config
- Link prefetching enabled
- Dev toolbar disabled
- Astro Sitemap installed