Nouveau
Old school Static Site Generator using Svelte and PostHTML
nouveau
Old school Static Site Generator using Svelte and PostHTML.
nouveau enhances your static web pages with JavaScript by using Svelte. No JavaScript is generated if the Svelte markup is purely static (i.e. presentational).
See the example project:
- example/src: Source files
- example/public: Generated files with compiled Svelte code
Quick start
Get started with a basic template:
npx degit metonym/nouveau#template my-app
cd my-app
yarn install
Install
yarn add -D nouveau
1) Folder structure
Create folders and index.html files in the src folder:
mkdir src
touch src/index.html
Your folder structure should look similar to this:
├── src
│ ├── index.html
│ └── [folder]/index.html
├── package.json
└── .gitignore
2) Content
Add the following to your src/index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<svelte>
<script>
let count = 0;
</script>
<button on:click="{() => { count += 1; }}">
Increment the count: {count}
</button>
</svelte>
</body>
</html>
3) Scripts
Add the following scripts to your package.json:
// package.json
{
"scripts": {
"start": "nouveau --dev",
"build": "nouveau"
}
}
Run the following command in development:
yarn start
For production, use:
yarn build
Customization
Customize the entry and outDir fields in your package.json:
"nouveau": {
"entry": "src",
- "outDir": "public"
+ "outDir": "dist"
}
License
