natemoo-re / microsite

Do more with less JavaScript. Microsite is a smarter, performance-obsessed static site generator powered by Preact and Snowpack.

Home Page:https://npm.im/microsite

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool



microsite


microsite is a fast, opinionated static-site generator (SSG) built on top of Snowpack. It outputs extremely minimal clientside code using automatic partial hydration.

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!


Microsite is an ESM node package, so it needs to run in a Node environment which supports ESM. We support the latest version of node v12.x LTS (Erbium) — see Engines for more details.

Ensure that your project includes "type": "module" in package.json, which will allow you to use ESM in your project's node scripts.

Pages

Microsite uses the file-system to generate your static site, meaning each component in src/pages outputs a corresponding HTML file.

Page templates are .js, .jsx, or .tsx files which export a default a Preact component.

Styles

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 *.module.css.

Project structure

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

Acknowledgments

About

Do more with less JavaScript. Microsite is a smarter, performance-obsessed static site generator powered by Preact and Snowpack.

https://npm.im/microsite

License:MIT License


Languages

Language:TypeScript 79.4%Language:JavaScript 14.2%Language:CSS 4.6%Language:AppleScript 1.8%