Build and deploy

Publish the static files generated by a minista build. You do not need to keep a minista or Node.js server running in production.

Using the minimal setup through Configuration, this page covers building the home page, checking output, and publishing it.

Table of Contents

Check pages

Check the page structure before publishing.

npx minista check --json
npx minista inspect --json

check checks for page and route issues, while inspect displays the project configuration. Both also run page data fetching, so provide any required environment variables when using APIs. See Passing data to pages for how data fetching works.

Run TypeScript type checking separately if needed.

npx tsc --noEmit

Generate production files

npm run build

Set the build script to minista build. The default output directory is dist/. The minimal setup generates one HTML file for the home page.

dist/
└── index.html

Output depends on the pages and plugin settings. Files in public/ are also copied to the output directory, and pages with draft: true are excluded.

Data fetched from APIs or a CMS reflects its state at build time. If the source data changes after publishing, rebuild and update the output.

Preview the build

npm run preview

Set the preview script to minista preview. Check the home page at the displayed URL. You can also verify images, links, and Islands here after adding them. Preview serves generated files for review; it does not automatically rebuild changes.

Publish to static hosting

Use the following build settings on your hosting service.

ItemExample setting
Dependency installationnpm ci for npm projects with a maintained lockfile
Build commandnpm run build
Publish directorydist
Node.jsA version within the supported range

For manual deployment, copy the contents of dist/ to your host. Configure extensionless URLs and 404 handling on the hosting side. For example, whether about.html is served at /about depends on the host's rules.

See 404 page for handling missing URLs.

Public base path

Set base when publishing under a URL such as https://example.com/site/.

vite.config.ts
import { defineConfig, pluginSsg } from "minista"

export default defineConfig({
  base: "/site/",
  plugins: [pluginSsg()],
})

base is applied to assets processed by Vite and reference URLs to actual public files in SSG HTML. Also check the supported attributes and limitations for public references. Add the deployment path to regular page links yourself.

<a href={`${import.meta.env.BASE_URL}about`}>About us</a>

import.meta.env.BASE_URL refers to Vite's base value. Here it is "/site/", making the link /site/about. Changing base for a different deployment location also changes the link prefix. Concatenate about without a leading /.

This link assumes the host serves about.html at /about. To link directly to the HTML file, change about to about.html.

base does not change where pages are placed. Deploy the contents of dist/ at the host's /site/ location.

Relative base path

Use base: "./" if the deployment directory is not fixed.

References to output assets become relative paths, letting you move the files to another directory while preserving the structure inside dist/.

vite.config.ts
import { defineConfig, pluginSsg } from "minista"

export default defineConfig({
  base: "./",
  plugins: [pluginSsg()],
})

References to Vite-processed assets and public files in HTML are adjusted to the output depth. For example, a reference to public/logo.svg as /logo.svg becomes the following after building.

Output HTMLReference to logo.svg
dist/index.htmllogo.svg
dist/news/index.html../logo.svg

Regular page links are not adjusted automatically. Also, import.meta.env.BASE_URL is "./" and does not change to "../" according to page depth. Write links between pages relative to the URL of the page being displayed.

Link from the home page
<a href="./about.html">About us</a>
Link from news/index.html (when served at /news/)
<a href="../about.html">About us</a>

Adjust output and delivery

Change the output directory with build.outDir.

import { defineConfig, pluginSsg } from "minista"

export default defineConfig({
  plugins: [pluginSsg()],
  build: { outDir: "output" },
})

See Code formatting for delivery and Delivery archives to prepare HTML or ZIP files for delivery. The configuration reference covers file name hashes and minification.

Next, File-based routing adds about and news pages.