CLI app for pre-rendering SPA websites.
npm install presite  
Presite is an alternative to static site generators like Gatsby, Next.js and Nuxt.js etc, the difference is that it uses Puppeteer to prerender websites instead of relying on server-side rendering.
``bash`
npm i -g presite
Note that Presite relies on Chrome (or Chromium) browser on your machine, so you need to ensure it's installed before running Presite.
`bash`
presite ./path/to/your/site
Presite is supposed to work with existing single-page applications, first you use something like Create React App, Vue CLI, Parcel or Vite to create a production build of your app, then use Presite to pre-render the website to static HTML files.
Pre-rendered website will be generated into .presite folder.
with Create React App
`diff`
{
"scripts": {
- "build": "react-scripts build"
+ "build": "react-scripts build && presite ./build"
}
}
with Vue CLI
`diff`
{
"scripts": {
- "build": "vue-cli-service build"
+ "build": "vue-cli-service build && presite ./dist"
}
}
with Poi
`diff`
{
"scripts": {
- "build": "poi build"
+ "build": "poi build && presite ./dist"
}
}
with Vite
`diff`
{
"scripts": {
- "build": "vite build"
+ "build": "vite build && presite ./dist"
}
}
That's it, Presite prerender all pages of your website without any configuration!
Run presite --help for all CLI flags.
Presite also supports rendering non-HTML pages like XML or JSON pages, simply create files ending with .xml.js or .json.js, let's say you have a feed.json.js:
`js
import { createJSONFeed } from './somewhere/create-json-feed'
export default async () => {
const posts = await fetch('/api/my-posts').then((res) => res.json())
return createJSONFeed(posts)
}
`
You can export a function that resolves to a string or JSON object, then Presite will output this page as feed.json.
These pages are evaluated in browser in a