Build & Preview

nuxi build → .output/, nuxi preview to Test

Build & Preview

nuxi build creates a deployable .output folder. nuxi preview runs it locally for a final smoke test before you hit deploy.

4 min read Level 2/5 #nuxt#build#deploy
What you'll learn
  • Run nuxi build to produce a production output
  • Inspect the .output directory structure
  • Run nuxi preview to validate before deploy

nuxi build is the one command between your dev server and production. It runs Vite for the client, Nitro for the server, and writes a self-contained .output directory that any host can run.

Build

npx nuxi build

Output lands in .output/:

.output/
├─ server/
  └─ index.mjs         # Nitro entry — handles all SSR and API
├─ public/              # client assets — JS, CSS, fonts, images
└─ nitro.json           # build metadata

The whole folder is portable — copy it to any Node host and run node .output/server/index.mjs.

Preview Locally

nuxi preview runs the built output the same way production will.

npx nuxi preview

It starts the server on :3000, but unlike nuxi dev there is no HMR, no TypeScript checking, no DevTools — what you see is what users will see.

What Preview Catches

  • Missing env vars that dev silently fell back on
  • Asset paths broken by a wrong app.baseURL
  • Server routes that rely on dev-only modules
  • Hydration mismatches that only show up after a build

If preview works, deploy is nearly always painless.

Generate — The SSG Alternative

For static sites, use nuxi generate instead of nuxi build. It crawls every prerenderable route and writes plain HTML to dist/.

npx nuxi generate
ls dist/
# index.html  about/index.html  blog/post-1/index.html  _nuxt/...

The next two lessons cover deploying those outputs.

Deploying SSG →