What Is New in Nuxt 1
| Category | Highlights |
|---|---|
| New Features | Universal rendering (SSR, SPA, static generation), file-system routing, automatic webpack & Babel setup, hot module replacement, layout system, middleware support, per-page code splitting, programmatic API (Nuxt & Builder classes), renderRoute utility, production-ready build/start commands. |
| Improvements | Configurable via nuxt.config.js, static folder mapping, CLI starter templates, clearer documentation links, community module ecosystem. |
How does Nuxt 1 enable universal rendering (SSR, SPA, and static generation)?
Nuxt 1 lets you pick the rendering mode at build time - server-side rendering, single-page application, or fully static generated site.
- SSR delivers HTML on first request, improving SEO and time-to-content.
- SPA mode skips server rendering and behaves like a classic Vue SPA.
- Static generation pre-renders every route to HTML files for ultra-fast CDN hosting.
In practice you set mode or target in nuxt.config.js and run the appropriate build command.
What is the file-system routing model in Nuxt 1 and how does it simplify navigation?
Every .vue file placed in the pages/ directory automatically becomes a route.
<!-- pages/about.vue -->
<template>
<h1>About us</h1>
</template>
This eliminates manual router configuration; nested folders create nested routes, and dynamic filenames (e.g., _id.vue) generate parametric routes.
How can I extend Nuxt 1 programmatically or as middleware in a custom server?
You can instantiate Nuxt and Builder directly in Node and attach Nuxt's render function to any Express/Koa server.
const { Nuxt, Builder } = require('nuxt')
const config = require('./nuxt.config.js')
config.dev = process.env.NODE_ENV !== 'production'
const nuxt = new Nuxt(config)
if (config.dev) {
new Builder(nuxt).build()
}
app.use(nuxt.render) // Express example
This approach gives full control over server logic while still leveraging Nuxt's rendering pipeline.
What are the production deployment steps for a Nuxt 1 application?
In production you separate the build and start phases.
# Build once
nuxt build
# Then run the server
nuxt start
Most CI/CD pipelines cache the .nuxt directory after nuxt build and only execute nuxt start on the target host.
Frequently Asked Questions
Does Nuxt 1 require a special configuration file?
You must create a nuxt.config.js at the project root to customize routes, plugins, and build options.
Can I use Nuxt 1 with an existing Express server?
Yes you import Nuxt, build it if needed, and call app.use(nuxt.render) after your API routes.
How do I generate a static site with Nuxt 1?
Run nuxt generate which pre-renders each page to static HTML files in the dist folder.
What command starts the development server in Nuxt 1?
Simply executing nuxt (or npm run dev) launches hot-reloading on localhost port 3000.
Is code splitting handled automatically in Nuxt 1?
Yes each page component is split into its own webpack chunk without extra configuration.
How do I access the rendered HTML of a specific route programmatically?
Use nuxt.renderRoute('/about', context) and handle the returned html and error objects.