An opinionated Astro starter with SolidJS islands, Tailwind CSS v4, Biome, TypeScript strict mode, and a minimal layout already wired up.
pnpm create astro@latest --template eliancodes/elians-astro-startkit- Astro 6
- SolidJS via
@astrojs/solid-js - Tailwind CSS v4 through the Vite plugin
- Sitemap generation via
@astrojs/sitemap - Biome for linting and formatting
- TypeScript strict config
- Import aliases for
@components/*and@layouts/* - A basic layout with header, footer, global styles, and system dark mode support
pnpm install
pnpm devThe dev server runs at http://localhost:4321.
| Command | What it does |
|---|---|
pnpm dev |
Start the local Astro dev server |
pnpm start |
Alias for pnpm dev |
pnpm build |
Run astro check and build the site |
pnpm preview |
Preview the production build locally |
pnpm astro ... |
Run Astro CLI commands |
pnpm format |
Format the codebase with Biome |
pnpm lint |
Run Biome lint rules with autofix enabled |
pnpm check |
Run Biome checks without writing files |
/
├── public/
│ └── favicon.svg
├── src/
│ ├── components/
│ │ ├── BaseFooter.astro
│ │ ├── BaseHead.astro
│ │ ├── BaseHeader.astro
│ │ └── Counter.tsx
│ ├── layouts/
│ │ ├── Default.astro
│ │ └── PageSupportingDarkmode.astro
│ ├── pages/
│ │ ├── index.astro
│ │ └── robots.txt.ts
│ └── styles/
│ └── global.css
├── astro.config.ts
├── biome.json
├── package.json
└── tsconfig.json
src/pages/index.astroshows the default layout plus a small Solid counter island.src/layouts/PageSupportingDarkmode.astrotoggles thedarkclass based on the user's system preference.src/styles/global.cssimports Tailwind and sets the base light/dark body colors.astro.config.tsincludes the site URL, Solid integration, sitemap integration, and Tailwind's Vite plugin.
This starter includes a couple of path aliases:
@components/*->src/components/*@layouts/*->src/layouts/*