npm init microsite
Microsite's public API is quite stable, but I caution professional users to consider this a WIP! There are plenty of quirks and bugs (especially with
dev mode) that are being ironed out until Microsite reaches a more stable v2.0.0!
Ensure that your project includes
"type": "module" in
package.json, which will allow you to use ESM in your project's
Microsite uses the file-system to generate your static site, meaning each component in
src/pages outputs a corresponding HTML file.
Page templates are
.tsx files which export a
default a Preact component.
Styles are written using CSS Modules.
src/global.css is, as you guessed, a global CSS file injected on every page.
Per-page/per-component styles are also inject on the correct pages. They are modules and must be named
project/ public/ // copied to dist/ src/ global/ index.css // included in every generated page index.ts // shipped entirely to client, if present pages/ // fs-based routing like Next.js index.tsx tsconfig.json