Release Notes

v2.5.0 Released on

15,000 line changes with 230 squashed commits by more than 30 contributors made this version possible! :heart:

What's new?

Typescript DX

No longer needed to install nuxt-ts for typescript support. Nuxt.js officially supports TS by installing @nuxt/typescript. Please see #5079 for reasons behind such migration.

Babel

Babel 7.4, Core-js v3, and Object.assign polyfill for better browser support.

Stability

More than 30 fixes, refactors and performance improvements.

Open in Browser

Use nuxt dev -o to instantly open project in the browser and enjoy a cool loading screen:

nuxt-loading-screen

.nuxtignore

Before v2.5, you were able to ignore files through an ignore prefix. As using the prefix over and over, ignoring files (and implementing custom structures) was a bit tedious on the long run. We came up with something more sophisticated: A .nuxtignore file. Following the same specs as a .eslintignore or a .gitignore file, you can now define what files or folders to ignore through a .nuxtignore file in your project root.

Examples and more info in the .nuxtignore docs

[IMPORTANT] Migration Guide

Lock Files

For a clean upgrade, please remove yarn.lock / package-lock.json file from your project before upgrade.

Programmatic API / Middleware

If not already done, please explicitly call nuxt.ready() after new Nuxt(). nuxt.ready() was always async, but not awaiting the function call has now a severe impact.

   const nuxt = new Nuxt(config)
++ await nuxt.ready()

TypeScript

  1. Please replace nuxt-ts dependency and use nuxt + @nuxt/typescript. (Also nuxt-ts-edge to nuxt-edge + @nuxt/typescript-edge for edge users)
{
--  "nuxt-ts": "^2.4.2"
++  "@nuxt/typescript": "^2.5.0"
++  "nuxt": "^2.5.0"
}
  1. Configuration API to customize/disable type checking has been moved from build.useForkTsChecker to build.typescript.typeCheck. Please see #5079 for more details.
build: {
-- useForkTsChecker: false // or ForkTsChecker options
++ typescript : {
++   typeCheck: false // or ForkTsChecker options
++ }
}

Features

  • feat(babel): include es6.object.assign by default (Clark Du) (52fe145a)
  • feat(cli): lock project during build or generate (#4985) (Pim) (4e51723e)
  • feat(cli): option to open the project in the browser (#4930) (Ricardo Gobbo de Souza) (4c7bd9c5)
  • feat(generate): return non-zero code or page error (fixes #4991) (#5195) (Jarek Lipski) (c6565c97)
  • feat(module): support src as a function in addModule (#4956) (Ricardo Gobbo de Souza) (1e9eb4b7)
  • feat: support .nuxtignore (#4647) (Xin Du (Clark)) (59be77a2)
  • feat: support devModules option (#5102) (Jonas Galvez) (e87711c5)
  • feat(ts): nuxt configuration typedefs (#4854) (Kevin Marrec) (92f81e01)
  • feat(vue-app): universal fetch (#5028) (Pooya Parsa) (2015140d)
  • feat(vue-renderer): improvements (#4722) (Pooya Parsa) (29297160)
  • feat(vue-renderer): use async fs (#5186) (Pooya Parsa) (d07aefa5)
  • feat(ts): better DX for typescript support (#5079) (Kevin Marrec) (920f444b)
  • feat: loading screen (#5251) (Sébastien Chopin, Pooya Parsa) (ef41e205)
  • feat: support core-js 3 (#5291) (Xin Du (Clark)) (d094c4a9)

Fixes

  • fix(builder, vue-app): order of plugin execution based on order in array (#5163) (Dmitry Molotkov) (a867dbd3)
  • fix: correct public path in generation and start (#5202) (Xin Du (Clark)) (648062c3)
  • fix: default for-exit to false to prevent dev exit (pooya parsa) (a347ef9b)
  • fix: disable "analyze" for nuxt generate (#4975) (Alexander Lichter) (574a2eb2)
  • fix: disable parallel build when extractCSS is enabled (Clark Du) (aad46ed6)
  • fix: extra properties in templateFiles (#4925) (Xin Du (Clark)) (ca191240)
  • fix: fix non standard esm modifications (pooya parsa) (fb87a559)
  • fix: generate failure (#5007) (Andrey Shertsinger) (bcd672f9)
  • fix: keep-alive component data should not be updated (#5188) (Xin Du (Clark)) (1ea86617)
  • fix: not send Server-Timing header if no timing info (Clark Du) (d9a0b5f6)
  • fix(postcss): default to preset-env and cssnano last (#5215) (Alexander Lichter) (adf423a5)
  • fix: publicPath is not reactive in dev restarting (#5227) (Xin Du (Clark)) (1fb7538d)
  • fix: refactor file watchers (chokidar/linux workaround) (#4950) (Pim) (5ec5932b)
  • fix: remove cache-loader for external resources (#4915) (Xin Du (Clark)) (0223e56d)
  • fix: respect namespaced in store module (#5189) (Xin Du (Clark)) (9e1ef888)
  • fix: revert templatFiles name (#4924) (Xin Du (Clark)) (f70645e5)
  • fix: trailing comma in tsconfig (#5061) (Sergey Vikulov) (1fb44d94)
  • fix(ts): deprecate isClient, isServer, isStatic (#5211) (Daniel Hritzkiv) (29c3c425)
  • fix(types): reflect chainlable NuxtLoading methods (#5104) (Matjaž Lipuš) (66273f4b)
  • fix: Unexpected token .... Expected a property name in Safari (Clark Du) (eef7f695)
  • fix(vua-app): clone mount error to prevent mutating read-only error object (#5214) (Alexander Lichter) (37006f62)
  • fix(vue-app): avoid css chunk error (#5173) (Yutaka Sasaki) (41028a40)
  • fix(webpack): clone config.entry (fixes #4849) (#5236) (Julien Dargelos) (82167651)
  • fix: disable extract-css-chunks-webpack-plugin in dev mode (#4888) (Xin Du (Clark)) (928a230f)
  • fix(server): handle decodeURI error (#5243) (phof) (5b7f6d78)
  • fix: correct socket address in use error message (Clark Du) (2eb19653)
  • fix(utils): relax lock settings (#5280) (Pim) (65a431d6)
  • fix(vue-app): multiple named views cause invalid syntax (#5262) (Michael Leaney) (d03a61b0)
  • fix(webpack): loaders in extend config is broken (#5292) (Xin Du (Clark)) (0eb5ed97)
  • fix(vue-app): duplicated router.base when using context.redirect(object) (#5290) (Nianyong) (cf02e822)
  • fix(vue-app): decode router base to support unicode characters (#5297) (Alexander Lichter) (3ac01df4)

Performance Improvements

  • perf: await routeData promises in parallel (#5027) (Alexander Lichter) (0826d7e5)
  • perf(core): skip esm for node_modules and non .js files (#5220) (Pooya Parsa) (aabb1f69)
  • perf(webpack): use futureEmitAssets (#5003) (Alexander Lichter) (3997d504)
  • perf(ts): transpileOnly when using nuxt-ts start (#4906) (Kevin Marrec) (17cc12f0)

Examples

  • examples(jest-puppeteer): fix package .json (#4997) (Andrew Cravenho) (dfc8dd57)
  • examples: improve vuex store example (#5017) (Alexander Lichter) (a9511e58)
  • examples(pug): fix example by adding plain-pug-loader (#5223) (Paul Geisler) (320a46fe)
  • examples(vuex-store): change to module store (#4923) (Alexander Lichter) (be41ae1c)
  • examples: add pug-stylus-coffee (#4927) (chiboreache) (6d059698)
  • examples: add tsx example (#4855) (andoshin11) (5101dc6a)
  • examples: fix jest test dependencies (#5155) (Dmitry Molotkov) (1c3761a6)
  • examples: fix links to vue-meta repo (#5018) (Pim) (06f4762e)
  • examples: rebase on latest stable nuxt version (#4874) (Alexander Lichter) (47898fbd)
  • examples: zero-downtime pm2 typescript example (#4907) (Dmytro) (1fb9af33)
  • examples: fix dynamic components example (#5294) (Dmitry Molotkov) (d9db45c2)

Refactors

  • refactor: generate routes and template files in builder (#4883) (Xin Du (Clark)) (4c5a59e1)
  • refactor: improve modern middleware and spa modern rendering (#5037) (Xin Du (Clark)) (05299d67)
  • refactor: isModernBrowser return boolean for avoiding duplicate call (Clark Du) (c6d8e8ff)
  • refactor: not detect modern browser if modern mode is disabled (Clark Du) (2b4d79c1)
  • refactor: remove builder coupling from server (#5157) (Pooya Parsa) (13cb0f73)
  • refactor: remove unnecessary onEmit in old webpack (Clark Du) (eac6d022)
  • refactor: some small stuff (#4979) (Alexander Lichter) (69dfd848)
  • refactor: fix typos (#4922) (Alexander Lichter) (569b6aab)
  • refactor: unify context in webpack module (#5054) (Xin Du (Clark)) (9860eb6a)
  • refactor: use spread syntax for plugin push (#4976) (Alexander Lichter) (31cb1873)
  • refactor: fallback to babel-preset-env defualt targets when buildTarget is not specified (Clark Du) (176641f6)
  • refactor(ts): add warning for nuxt-ts deprecation (#5301) (Kevin Marrec) (a11afd45)

Chore

  • chore(babel-preset): create readme with basic docs (#5127) (HG) (04cdd602)
  • chore: don`t ignore .nuxtignore (#5169) (Dmitry Molotkov) (39c9ab59)
  • chore: enable yarn.lock maintenance (#5063) (Xin Du (Clark)) (17b53ebf)
  • chore(vue-app): suppress deprecated warning for classic vuex in prod (#5137) (Shingo Sato) (f39205a7)

Tests

  • test: add await for promisable expect (Clark Du) (fabf1c07)
  • test: add chrome detector (#4984) (Xin Du (Clark)) (855705bd)
  • test: add describe.posix and win (Clark Du) (e9ba2f97)
  • test: fix macos e2e tests (Pooya Parsa) (2c763df1)
  • test: improve nuxt-loading component tests (#5005) (Pim) (75a74543)
  • test: mock enquirer in typescript tests (#5025) (Pim) (ad6a8cda)
  • test: skip reqest in dev test for now (Clark Du) (3e678793)
  • test: try to fix unhandled request (Clark Du) (2f2baacb)
  • test: turn off cli dev test (Clark Du) (5c053f5c)
  • test: unit tests for generator (#4857) (Xin Du (Clark)) (e22a282e)
  • test: unit tests for @nuxt/util (#4880) (Xin Du (Clark)) (96bab9f0)
  • test: unit tests for server module (#5154) (Xin Du (Clark)) (cc573a49)
  • test: update cli snapshot (Clark Du) (3dd1a285)
  • test: unhandled open handles (Clark Du) (858c9eeb)
  • test: change cli.test to be more accurate (#4957) (Xin Du (Clark)) (68f6880f)
  • test: use puppeteer-core (#4929) (Pooya Parsa) (940a36fd)
  • test: fix e2e test by downloading chromium (#5254) (Pooya Parsa) (2561b68a)
  • test: fail tests in case of unhandled errors (#5255) (Pooya Parsa) (d6b505aa)

v2.4.5 Released on

v2.4.5 (2019-02-26)

Bug fixes and Improvements

  • builder: bundle resources other than js(x)/json in node_modules (#4913) (71a70fe)
  • cli: dont force exit when it was explicitly disabled (#4973) (4b82aa9)
  • cli: show warning on forced exit (#4958) (3d2deac)
  • dependencies: update serve-placeholder and esm (#4970) (111455f)
  • vue-renderer: preload modern resource in spa modern mode (#5043) (3516580)
  • vue-app: fix asyncData memory leak on client-side (#4966) (4086800)
  • vue-app: fix getNuxtChildComponents method (#4969) (dbf7099)
  • vue-app: use browser to handle scrolling position on page reload... (#5080) (7001312)
  • webpack: bundle resources other than js(x)/json in node_modules (#4913) (71a70fe)
  • nuxt-ts: error catch in nuxt-ts binary (#5086) (4f887f6)

v2.4.3 Released on

🐛 Bugfixes

  • webpack: Update dependency terser-webpack-plugin to ^1.2.2.
  • webpack: Update dependency webpack to ^4.29.2
  • utils: Fix serializeFunction for external imports (#4916)
  • config: Warn when using array for postcss config (#4936)
  • module: support src as a function in addModule (#4956)
  • server: await buildDone hook (#4955)

v2.4.2 Released on

Bugfixes

  • Handle async components correctly when using nuxt-ts (PR #4886)
  • Fix extractCSS in dev mode (PR #4892)
  • Correctly apply class when using linkPrefetchedClass (PR #4893)

v2.4.0 Released on

Upgrade Note ⚠️

Due to a known problem (webpack/webpack#8656, #4869, #4839) users of npm should either remove package-lock.json and reinstall before upgrade or use npm update acorn --depth 20 && npm dedupe after upgrading to 2.4.0. yarn users should have no problems but removing yarn.lock still recommended before the upgrade process.

Important news 👀

New core team member 🐤

We are really proud to announce Kevin Marrec (@kevinmarrec) as a new core team member of Nuxt.js. He is French 🇫🇷 and responsible for the TypeScript integration 💚

Official Consulting ⛑

We now offer official support & consulting from the core team. We partnered with Otechie for the process and already did some beta-tests with selected companies.

Are you interested or curious? Learn more on https://otechie.com/nuxt :raised_hands:

RFC Process 📎

We invite you to take a look at our nuxt/rfcs repository where we discuss the future of Nuxt and its vision.

Here are some interesting proposals if you want to learn more about the upcoming changes of Nuxt:

Release Plan 🚢

Starting with this release, Nuxt will adhere to a formalized release plan (as good as possible). Also, an end of life for older major versions is defined within RELEASE_PLAN.md.

Quick summary:

  • Nuxt major releases are planned every 6 months.
  • The release cycle for Nuxt.js minor versions is roughly 4 weeks.
  • Fixes will be released as soon as possible after the actual PR/commit

We strongly invite you to read the RELEASE_PLAN.md for further details.

Thank you ❤️

We want to specially thanks:

  • Our contributors submitting bug reports, feature requests and commenting on issues
  • Our users participating on our Discord server and sharing the love by mentioning our Twitter account
  • All the devs working for companies using Nuxt.js and who helped us building a showcases list
  • Our backers and sponsors supporting us financially through our open Collective

New Features ✨

Speaking of TypeScript...

TypeScript support has landed!

nuxt-ts

In order to run Nuxt with TypeScript, we created a new distribution, called nuxt-ts (we also have nuxt-ts-edge). We want to thank @hmsk for his donation of the package name on npm ❤️

You can explore Nuxt TypeScript example or play with it directly in our Nuxt TS CodeSandBox.

For a more advanced example, you can look at the HackerNews-TS repo or play with it on CodeSandBox, made by @husayt & @kevinmarrec.

This work has been made by @kevinmarrec with the help of @pi0 & @Atinux.

:warning: Experimental: We are waiting for your feedback to keep improving it and breaking changes can occur without a semver major release. However, all changes will be documented properly

Smart prefetching ⚡️

Nuxt.js will automagically prefetch the code-splitted pages linked with <nuxt-link> when visible in the viewport by default. This hugely improves the end user performances, inspired by quicklink.

nuxt-prefetch-comparison

Demos are online and we recommend you to try it out to feel the difference:

Bonus: we added $nuxt.isOnline and $nuxt.isOffline which is reactive, so you can use it directly inside your components (see this example).

You can learn more about this feature in the associated PR #4574 and in the documentation.

HMR & best practices for store/ 👀

Save more development time with full HMR support for the store (mutations, getters, and actions).

nuxt-vuex-hmr

This feature has been implemented by @manniL & @Atinux on PRs #4589, #4582 and #4791

Autocomplete for VS Code (via. Vetur extension) ✅

If you are using VS Code, with this version, you will now have autocomplete for Nuxt.js components:

nuxt-vs-autocomplete

This feature has been implemented by @octref & @Atinux on PR #4524

Port taken? Nuxt got your back! 💪

If Nuxt wants to listen on a port which is already used, it will warn you in development and listen to a free port instead:

49249621-efe2e780-f431-11e8-90fb-ba48e67ba5c9

In production it will throw an error instead to avoid unwanted behavior:

49249634-f8d3b900-f431-11e8-9f51-afbf3ffc68ed

This feature has been implemented by @ricardogobbosouza on PR #4428 with the help of @pi0 and @manniL.

Suggest installing missing dependencies or mismatches 💯

Nuxt requires all peer like dependencies as a dependency for easier usage. Sometimes this causes unwanted behaviors when users explicitly add a specific version in their package.json which is incompatible with nuxt. This could also help to resolve popular Vue packages version mismatch error (#198, #669, #1084, #1414, #1851, #2079, #2406, #3454).

Nuxt is now able to automatically self-verify installed dependencies and warn with a proper message in case of detecting problems.

image

This feature has been implemented by @pi0 in PR #4669

Auto-detection of modern bundles 🥇

When running nuxt start, Nuxt will automatically detect if you built your app modern mode enabled. No need to run nuxt start --modernexplicitly anymore 🌟

screenshot 2018-11-30 at 16 55 48

This detection was created by @clarkdo on PR #4422

Plugin modes and file extensions 💅

Until now, you used ssr: false in your plugin declarations to disable server-side rendering. We decided to deprecate that option and introduce a mode instead, which can be 'all', 'client' or 'server'. No worries, ssr is still working (until Nuxt 3).

The new feature coming with the mode is that you can define it by using the file suffix:

  • plugins/plugin.server.js
  • plugins/plugin.client.js
  • plugins/plugin.js

By adding the plugins to your nuxt.config.js:

plugins: [
  '~/plugins/plugin.server.js',
  '~/plugins/plugin.client.js',
  '~/plugins/plugin.js'
]

The declaration will be internally transformed to:

plugins: [
  { mode: 'server', src: '~/plugins/plugin.server.js' },
  { mode: 'client', src: '~/plugins/plugin.client.js' },
  { mode: 'all', src: '~/plugins/plugin.js' }
]

(If you specify the mode manually, it will overwrite the suffix detection)

This feature has been implemented by @clarkdo on PR #4592

Module commands 🖥

Nuxt modules can now include bin scripts that are recognized by Nuxt's CLI.

Here's an example of my-module/bin/command.js:

#!/usr/bin/env node

const consola = require('consola')
const { NuxtCommand } = require('@nuxt/cli')

NuxtCommand.run({
  name: 'command',
  description: 'My Module Command',
  usage: 'command <foobar>',
  options: {
    foobar: {
      alias: 'fb',
      type: 'string',
      description: 'Simple test string'
    }
  },
  run(cmd) {
    consola.info(cmd.argv)
  }
})

The command could be run with:

npx nuxt command arg1 arg2

You can learn more about that in the modules command documentation.

:warning: Experimental: We are waiting for your feedback to keep improving it and breaking changes can occur without a semver major release. However, all changes will be documented properly <3

This feature has been implemented by @galvez on PR #4314 with the help of @pi0.

PostCSS in Vue Components 💃

You can now use lang="postcss" in your Vue components. Postcss has applied to all your styles anyway (e.g. to resolve aliases like ~) but the lang attribute enables autocomplete and syntax highlighting for some IDEs.

nuxt-postcss

This feature has been implemented by @manniL on PR #4417.

No more extensions for Stylesheets needed 🦅

stylesheet extensions

We are concerned to improve the Developer Experience ("DX") with each release. This small change allows you to omit the file extension for CSS/SCSS/Postcss/Less/Stylus/... files listed in the css array inside your nuxt.config.js. For the plugins or serverMiddleware key, this is already possible.

This feature has been implemented by @manniL on PR #4671.

SSR Bundle improvements 🔹

We made a full rewrite of how SSR bundle is packaged.

This means better performance, less memory overhead, fewer OOM crashes and easier SSR bundle debugging.

_ Before After Diff
Dist 8.2M 7.2M -1M / 12%
Dev 281 MB (RSS: 439 MB) 237 MB (RSS: 354 MB) -44M / 16% (RSS: -85M / 19%)
Start 106 MB (RSS: 169 MB) 71.7 MB (RSS: 137 MB) -34M / 32% (RSS: -32M / 19%)

This feature has been implemented by @pi0 on PR #4439.

Other changes 🌔

  • process.modern can be used for distinguishing modern environment.
  • Add server.timing to give Server-Timing header, useful for monitoring and performances overview (PR #4800)
  • ⚠️ Experimental: Enable HardSourceWebpackPlugin by hardSource: true in hardSource of nuxt.config.js
  • You can now set scrollToTop to false in pages (PR #4564)
  • Aliases for nuxt-link and nuxt-child (n-link and n-child) are available now (PR #4525)
  • Components can now be used in PascalCase as recommended by the Vue styleguide (PR #4396)
  • VueMetas headAttrs are now supported for the appTemplate (PR #4536)
  • More browsers are added to the list of modern browsers (PR #4516, PR #4775)
  • Loaded resources can now have a crossorigin attribute (PR #4472)
  • Modern mode resources are preloaded and will be pushed via HTTP2 server push if set (PR #4508)
  • Add option to disable the compression middleware (PR #4381)
  • Add option to disable the FriendlyErrorsWebpackPlugin overlay (PR #4381)
  • Add exclude option to exclude pages from being generated (in static mode) but still get rendered via fallback/SPA (PR #4754)
  • Support build.hotMiddleware.client (PR #4796)
  • New examples have been added:
  • Internal changes:
    • feat: use runInNewContext: true for nuxt dev (#4508)
    • feat: check modern build file in modern mode (#4467)
    • refactor: migrate to extract-css-chunks-webpack-plugin (#4495)

Further Patches (30+) 🔍

  • hotfix(vue-app): ReferenceError error passed with routeChanged (PR #4444)
  • fix(vue-app): properly serialize head functions (PR #4558 #4585)
  • fix(vue-app): Handle middleware correctly when using Vue.extend in layout (fix #4724)
  • fix (vue-renderer): remove undefined script in modern mode & generated (https://github.com/nuxt/nuxt.js/commit/0a21d4b34ca2f3bde2a54452f3d6831a0b1ee362)
  • fix: add option to rewatch on path after raw fs event (PR #4717)
  • fix(builder, module): addLayout and nuxt.config precedence over auto-scanned layouts (PR #4702)
  • fix: Support plugins with a directory and index.js (PR #4714)
  • fix: use case insensitive regex for webpack loader rules (PR #4728)
  • fix: require postcss module via resolver (PR #4737)
  • fix: Safari fix is not injected in client modern mode (https://github.com/nuxt/nuxt.js/commit/ecf76d91f1bec8dcab8f2c7715e0e07a19d0b6fe)
  • fix(server): allow rendering urls with unicode characters (#4512)
  • fix(builder): add lodash inside templates (PR #4368)
  • fix: fall back to default value when publicPath is falsy (PR #4365)
  • fix: modern=true or false not work as expected (PR #4378)
  • fix: empty error message in dev mode (https://github.com/nuxt/nuxt.js/commit/3d990fe60675f44a1771b765a73d9bbe5d5fa8f8)
  • fix(progress-bar): allow 0 for values and remove duplicate defaults (PR #4397)
  • fix(vue-app): allow passing custom props to error function (PR #4462)
  • fix(webpack): deepClone before calling extendConfig (PR #4464)
  • fix(vue-app): router.meta is null on extendRoutes(PR #4478)
  • fix: merge route.meta into options.meta (PR #4479)
  • fix: improvements for build and dev stability (PR #4470)
  • fix(vue-app): Fix route meta to handle order (https://github.com/nuxt/nuxt.js/commit/45be6384794fa5239b27ade8966d5d40955d8bb7)
  • fix(dev): Show correct path when webpack watched files changed (https://github.com/nuxt/nuxt.js/commit/25dea5f52a30628c43213fdc6d620c0d0eda8d9d)
  • fix(webpack): allow changing devtool with extend (PR #4515)
  • fix: keepAliveProps broken in (PR #4521)
  • fix: csp SHA hashes accumulate when using custom script-src rules (#4519)
  • fix: duplicate style in extractCSS (#4546)
  • fix: hmr in modern mode (#4623)
  • fix: wrong devMiddleware in non-modern dev mode (https://github.com/nuxt/nuxt.js/commit/35151150fde5ad21087f14bf22cf1acf0f150979)
  • fix(ts): fix $nuxt.$loading typedefs (#4778)
  • fix(ts): Add missing loading property to Component options (#4786)
  • fix: match subdir under node_module in transpile (#4850)

v2.3.4 Released on

(Please skip v2.3.3 release. It was mistaken.)

🔧 Fixes

  • CLI: nuxt-start command should always start nuxt in production mode (#4384)
  • Modern Mode: Fix behavior where modern=true or false didn't work as expected (#4378)
  • Router: Correctly handle Unicode page names (#4402)
  • Router: Emit triggerScroll event after changing the layout (#4399)
  • Components: Allow 0 values for progress bar attributes (#4397)
  • Server/Tests: Correctly print timeout error message for JSDom (#4412)

⚡️ Dependencies

  • Update dependency vue-router from 3.0.1 to 3.0.2 (#4394)
  • Update dependency @nuxt/friendly-errors-webpack-plugin from 2.3.0 to 2.3.2
  • Update dependency mini-css-extract-plugin from 0.4.4 to 0.4.5
  • Update dependency webpack from 4.26.0 to 4.26.1
  • Update dependency vue-meta from v1.5.5 to v1.5.6
  • Remove opencollective dependency from nuxt-start (#4415)
  • Remove lodash dependency from packages to reduce the nuxt-start size (#4411)

v2.3.2 Released on

Fixes

  • Use exact versions for Nuxt internal packages
  • Fallback to default value when publicPath is falsy (#4365)
  • Add lodash inside templating (#4368)

v2.3.1 Released on

📝 Release Notes

With v2.3, Nuxt.js is splitted into smaller packages (Aka a mono-repo). This means smaller packages, independent versioning support and ability to replace any part of Nuxt.js without dirty hacks. Before this release, we carefully tested the latest updates using edge release channel against real-world projects and there should be no breaking changes.

Please note that for upgrading Nuxt.js just changing version inside package.json is not enough. Please use yarn upgrade or npm upgrade so that the final directory structure of node_modules will be correct. In case of problems clean up node_modules and yarn.lock/package-lock.json. Still having problems? open an issue in cmty!

🔧 Fixes and Enhancements

  • CLI and DX improvements (#4259)
  • CLI cleanups and improvements (#4222)
  • Improve nuxt-loading component (#3891)
  • Set defaults for port and host values (#4207)
  • Dynamically read environment variables when loading nuxt.config.js (PR #4208)
  • Support custom pushAssets function to control http2 push headers (#4198)
  • Reduce duplicate code in routes.js (#4121)
  • Print warning when using build.extractCSS.allChunks (#4097)
  • Throw an error when layout property is not string (#4142)
  • Use require.resolve to get the path of babel-loader (#4150)
  • Check style resources for existence (#4155)
  • Serialize config head fn shorthand correctly (#4283)
  • Don't accept ranges (#3870) (#4295)
  • Correctly resolve layouts with nested custom dir (#4135)
  • Warn on unknown mode (#4303)
  • Use postcss.order to change order of postcss plugins(#4318)
  • Fix for double escaping static class on SSR (#4312)
  • Fix stable route sorting for Node v11 (#4331)

🎉 New Features

  • Modern build support (#4231) (#4241) (#4254) (#4264)
  • Dedicated help command (nuxt help [cmd]) (#4248)
  • List commands nuxt --help (#4245)
  • Support asynchronous nuxt.config.js (#4021)

⚡️ Dependency Upgrades

❄️ Deprecations

  • Deprecate styleResources because of performance issues. Use our new community module instead (it's a drop-in replacement) (#4302)
  • Deprecate callback-based asyncData, fetch and middleware methods. Use Promises or async/wait instead. (#4256)

💄 Internal Refactors

  • Migrate nuxt into a mono-repo (#4051)
  • Refactor core into @nuxt/core, @nuxt/server and @nuxt/vue-renderer (#4202)
  • Refactor builder into @nuxt/builder and @nuxt/webpack (#4171)
  • Move @nuxtjs/babel-preset-app into nuxt mono-repo and republish it as @nuxt/babel-preset-app (#4205)
  • Move common config to @nuxt/config (#4212)
  • Packaging and development improvements (#4193)
  • Extract eslint-config into own package (#4108)
  • Several test utils cleanups (PR #4180)

v2.2.0 Released on

Features

  • Show warning message when pages directory is missing. (PR #4054)
  • <nuxt-child/> accepts keep-alive-props as props of keep-alive (PR #4067)
  • Add configurable global name (PR #4012)

Fixes

  • Warn for non serializable data instead of Error (PR #4046)
  • Style module with extractCSS not work well (PR #4093)
  • generate: use isJS for matching assets to fix not found bug for assets with query strings (PR #4073)

v2.1.0 Released on

Features

  • Expose loading.throttle as an option (PR #3953)
  • Allow to customize or disable minimizer plugins (PR #4018)
  • Use understandable file names for analyze mode (PR #4014)

Fixes

  • Correctly evaluate options.server values port, host, socket (PR #3942)
  • Properly serialize undefined values in vuex store (PR #3913)
  • Don't allow to cache error pages (PR #3962)
  • Update all non-major dependencies, vue-meta to ^1.5.5 (PR #3991)
  • Apply default value for NODE_ENV environment variable (PR #4003)
  • Typofixes from https://github.com/vlajos/misspell-fixer (PR #4013)

Misc

  • Refactor client store code style (PR #3683)

v2.0.0 Released on

Migration guide for 2.0.0

Your migration is mostly straightforward as Nuxt 2 does not makes breaking changes. So you can try your chance and simply upgrade to Nuxt 2 using yarn add nuxt@^2.0.0 or npm install nuxt@^2.0.0 😉

The long but peaceful approach

  • Carefully read release notes
  • If you are using a VCS for your project commit and push latest changes and then checkout into a new branch
  • Stop any Nuxt process
  • [optional] Delete all directories .nuxt, node_modules, yarn.lock and package.lock.json
  • Ensure you are using the latest node version (Node 10.x and NPM >= 5 are recommended)
  • Upgrade nuxt.config.js, modules and serverMiddleware to use import/export instead of require
  • Ensure webpack and vue dependencies are not explicitly set inside your package.json, if so please upgrade them to match Nuxt used versions
  • Do npm install or yarn install
  • [optional] Use npm outdated or yarn outdated and manually update any other dependency with care
  • If you have a CDN deployment system, please make sure you have updated CI/CD configurations to publish .nuxt/dist/clientinstead of .nuxt/dist
  • If you are using build.extend, make sure your changes are compatible with Webpack 4.

Still Having problems? Make a bug report at CMTY or reach us using Discord

Major changes

  • We now use Webpack 4. We announced 2.x and started publishing latest changes as nuxt-edge package at March. But we wanted to make sure that most of the plugins were updated and stable before releasing a stable version of Nuxt.js
  • Due to server/client artifact isolation (PR #3758), external build.publicPath need to upload built content to .nuxt/dist/client directory instead .nuxt/dist.
  • ESM is supported everywhere you can now use export/import syntax in nuxt.config.js, serverMiddleware and modules.
  • Upgraded to use Babel 7 (PR #3667)
  • Use postcss-preset-env instead of postcss-cssnext (notes) (PR #3291), config build.postcss.preset is for postcss-preset-env options
  • Introducing nuxt-start for runtime only and nuxt-legacy to support Node < 8
  • Due to css-loader upgrade, use ~assets instead of ~/assets for alias in <url> CSS data type, e.g., background: url("~assets/banner.svg") (PR #3741)

Features

  • watchQuery lets you observe query strings and execute component methods (asyncData, fetch, validate, layout etc) on change (3d49d8d2905796f063b171fdd935da721622fe05)
  • You can now Ignore pages with a prefix (PR #2594)
  • Internal hooks can be set hierarchically in nuxt.config.js (PR #3766)
  • Added loading: false option to pages, see example, (PR #3629)
  • New stores modules can now be built by a combination of files (actions.js, mutations.js, getters.js and state.js) along with index.js (PR #3636)
  • Support functional filenames for webpack assets (PR #3787)
  • Server middleware watchers support (PR #3718)
  • HTTPS and Unix sockets support out of the box (PR #3831)
  • Support server option in nuxt.config.js to set HOST and PORT (PRs #3701)
  • Support using NUXT_HOST, NUXT_PORT environment variables (PR #3651)
  • Configure Vue directly in nuxt.config.js (PR #3655)
  • Add preset option for postcss in nuxt.config.js(PR #3734)
  • Make compression middleware customizable (#3863)
  • Environment variables starting with NUXT_ENV_ will be automatically included in process.env (#3862)
  • no-ssr has been upgraded to vue-no-ssr 1.0.0, it supports placeholderTag

Enhancements

  • Fix HTML script tag in core/renderer to remove W3C warning (PR #2971)
  • Add render:context hook (PR #3294)
  • Replace background-color to background in loadingIndicator (PR #3656), so you can use an image or some gradient for your background in SPA mode!
  • Correctly center loadingIndicator when using IE (PR #3779)
  • Add watch option to watch custom files to restart the Nuxt.js server (default: nuxt.config.js and serverMiddleware files) (PRs #3633 and #3718)
  • Isolate client and server artifacts (PR #3758) for better security of SSR bundles.
  • Using webpackbar and consola for a sexier CLI experience and better CI compatibility.
  • Change webpack asset names to names for development and to filehashes for production. (PR #3789). Also, prevent assets name collision in dev mode (Issue #3786)
  • Call global Vue errorHandler in fetch and asyncData (PR #3652, #3781)
  • Error page rendering before redirect (PR #3782)
  • Disable template literals in lodash templates (PR #3753)
  • Display proper error when the specified plugin isn't found (PR #3672)
  • Customize the path to your app.html template in nuxt.config.js (PR #3678)
  • Quiet option when building your Nuxt app (PR #3705)
  • Minify extracted CSS assets (#3857)
  • Add tests to check for changed files (#3893)
  • Overwrite store.registerModule to work seamlessly with SSR (#3909)
  • Add throttle option to skip progress for fast loads (#3886)

Deprecated

  • The vendor array isn't used anymore because of Webpack 4
  • We removed DLL support as it was not stable enough and Webpack 4 is much faster now.
  • Obsolete AggressiveSplittingPlugin (PR #3545)
  • The render.gzip option. Use render.compressor instead.

Internals

  • ESLint: Consistent parens in arrow functions (PR #3630)
  • ESLint: Require await in async function (PR #3676)
  • ESLint: Force dot-notation where applicable (PR #3677)
  • ESLint: Force if braces (no lonely ifs) (PR #3685)
  • ESLint: Prohibit var (PR #3681)
  • ESLint: Prefer const over let (PR #3650)

v1.4.5 Released on

Thanks to @clarkdo and @ederchrono for this fix ❤️

🔧 Fixes

  • fix(vue-router): router Expected "0" to be defined (22679cba668c5f2e9d2237e86f3640e46a7b0ac8) (#4394)

v1.4.4 Released on

Patches

  • Backport --no-generate option to nuxt build with SPA mode (PR #4127)

v1.4.2 Released on

Fix

  • Upgrade vue for fixing XSS vulnerability on SSR

v1.4.1 Released on

Patch

  • Upgrade vue-loader from 13.7.0 to ^13.7.2 for prettier issue (#3385)

v1.4.0 Released on

Minor

  • Feature: You can now customize the directories names (see PR #2748)
  • Feature: add static.prefix (PR #2755)
  • Feature: you can now add a layout with a module (see PR #2790)
  • Hooks: add context as third parameter of render:route hook (PR #2754)
  • Multiple policy support for Content-Security-Policy #2736
  • Inject ssrContext into createRouter and createStore (see PR #2831)

Fixes

  • fix: add the possibility to set staging environment via NODE_ENV (PR #2742)
  • Fix: Changing only the query on a non-dynamic component was not updating page data (fix #2737)

Misc

  • Refactor cli (PR #2783)

Thanks

Big thank you too all the contributors for these amazing pull requests 👏

v1.3.0 Released on

Minor

  • Add SPA fallback template, this is a killer feature for static generated websites, please read #2690
  • Check expected node version #2718
  • Support scrollBehaviour with transitions (fix #1376), big thank you to @homerjam for his help on this!

Fixes

  • Support auto import of .jsx files (PR #2696)

v1.2.1 Released on

Fixes

  • fix: Add postcss-import-resolver in dependencies

v1.2.0 Released on

Minor changes

Patches

  • Fix: redirect to external urls works with nuxt generate now (fix #2570)
  • Fix: ssrContext.error is not a function (PR #2610)
  • Fix: Add aliases (~, ~~, @ and @@) to postcss-import #2617 (fix #1453)
  • Fix: error undefined on plugins error for server-side (https://github.com/nuxt/nuxt.js/commit/00f98c150fe03b707bcc5949e66152a5b69dd234)
  • Fix: multiple components in one route (PR #2679)
  • Fix: resolve exact route prior to index (PR #2673)
  • Fix: Handle redirect in middleware to avoid calling asyncData & fetch, fix #542 and #2665

Examples

v1.1.1 Released on

Patches

  • fix(module): default module options to empty object
  • misc: use console.warn for warnings
  • style: format with prettier
  • fix: logError is not a function #2577.
  • fix: exit with code (0) on successful nuxt-build #2569.
  • fix: regression with module.addVendor with array #2574.
  • test: add failing test for #2574

v1.1.0 Released on

Improvements

  • Many improvements for better CLI error handling
  • CLI commands exit with code (1) on any unwanted error with modules (Except nuxt dev)

Minor

  • Add support for CSP script-src safe inline (PR #2549) via render.csp option in nuxt.config.js
  • Align nuxt-start package.json with main package.json (PR #2556) (nuxt-start is still WIP)

Patches

  • fix: Prioritize nested node_modules, fix #2558
  • fix: Nested redirect in spa mode
  • fix: Cannot read property 'call' of undefined when extractCSS is true, fix #2551
  • fix: Improve loading bar to handle page redirects (even to origin page), fix #2563

v1.0.0 Released on

1.0.0 is out! :tada:

It's been a long run and we are really proud to announce the official 1.0 release. Thank you so much for your support and we are looking forward to hear your feedback :heart:

Medium article: https://medium.com/@nuxt_js/nuxt-js-1-0-is-out-bab1af459972

Breaking changes

:warning: Minimum Node.js version required for Nuxt.js is also increased to 8.0.0 (Current LTS). This allows notable security and performance improvements for both Nuxt and SSR rendering by using native async/awaits and making development easier. So don't forget to upgrade Node to the latest version in both server and your local environment ;)

We have a new internal hook system now, some modules can be broken with 1.0 if they were relying on this.nuxt.plugin(), instead, they will have to use this.hook(), see module hooks documentation.

We removed the internal extensions for .ts, if you want to use TypeScript into Nuxt.js, we recommend you to check out our typescript example.

Deprecation

For the below depreciation, it will still work but you will get a warning to tell you to change your code to the new value.

For better bundling experience for server-side and client-side, we deprecated context.isClient and context.isServer in flavor of process.client and process.server. Since these variables comes from our webpack configuration, it will optimize your client-side and server-side bundles magically :nail_care:

We also deprecated dev property inside build.extend() in flavour of isDev.

Features

  • We are now ignoring files starting with a - in front of its filename (example: pages/-ignored.vue) (PR #2417)
  • Layout transitions #1620
  • Add route.meta (array of matched page .meta) into context, useful for middleware (see details)
  • Middleware: you can now define middleware as a function, see example
  • Store: you now have access to this.$router and this.app inside your store actions!
  • You can set body: true, in your head.script[] to move your scripts at the end of <body> (see example)
  • nuxt generate --no-build: Useful for conditions when just dynamic routes are being changed. This makes incremental builds much faster.
  • Hooks: you can extend even further Nuxt by using hooks now, the documentation is coming soon.
  • New configuration: build.styleResources, check out our style-resources example.

Improvements

  • Upgrade Vue to 2.5.x #1723 #1868
  • Upgrade to Vue-Router & Vuex to 3.0
  • No more babel warning #1698
  • Adds support for folders in /layouts #1865
  • Mode spa: Respect mounted hook on first render (fix #1629)
  • Add --version & -v flag to nuxt binary (you can do npx nuxt -v to know which version of nuxt.js you are using in your project) #1840
  • Improve error message when a plugin is not found #1846
  • Add ENV variable into app.html, corresponds to env from your nuxt.config.js
  • Context is shared across plugins and pages (useful for axios interceptor with redirect), it also improves perfs!
  • Improved plugins system
  • Better nuxt dev experience with faster and more stable reloads
  • SSR performance improvements thanks to node async/awaits
  • Allow redirects to external URL (#2265)
  • Support options.modulesDir as Array
  • Upgraded uglifyjs with parrallel options as default for faster builds

Fixes

v1.0.0-rc11 Released on

Fix

v1.0.0-rc10 Released on

Improvements

  • Add resourcesLoaded plugin for Renderer #1586
  • Fix: rename context.serverState to context.nuxtState #1600
  • Fix: Handle synchronous components attached to routes

v1.0.0-rc9 Released on

Features

  • Add context.nuxtState (only on client-side and universal mode), equals to window.__NUXT__, useful for plugins which are using beforeNuxtRender hook

Fix

v1.0.0-rc8 Released on

Features

  • We now use Vuex 2.4.0 which allow us to bind context into actions and mutations! If you use official axios-module you can now use:
export default {
  actions: {
    async getProfile({ commit }) {
       const profile = await this.$axios.$get('user/profile')
       // Also app context is available using `this.app`
    }
  }
}

Improvements

  • Fix compile error when using scrollBehavior #1517
  • Fix maximum call stack size exceeded #582
  • Match correct route when resolveComponents in hash mode #1532
  • Remove bulma in dependencies #1531
  • Disable ModuleConcatenationPlugin as of some problems with resource hints #1508
  • Use css-loader@0.28.6, you can now use ~/assets/... into your <style>

v1.0.0-rc7 Released on

Features

  • Add <no-ssr> component (from vue-no-ssr), it allows you to render component only for client-side, see example
  • Add process.mode to let you know in which mode your are into your application ('universal' or 'spa')
  • Add loading.rtl option (default false) to set the direction of the progress bar from right to left
  • Advanced: Plugins can inject a value into app and every vue instances, see example for more details

Improvements

  • Move store replaceState after plugins calls, this way, plugins can update the store before hydratation on client-side (https://github.com/nuxt/nuxt.js/commit/8dca35821621aa28e977eda189049d594464662e)
  • Fix "Invalid character in error Message" (#437, #438, @yuchonghua)
  • Fix renderer: resolve handler key as option for serverMiddleware (459363beeafbf899dc13fa08e9a304da8a03ef79, #1274)
  • Rename context.hotReload to context.isHMR
  • build.extend can now return the new config (PR #1447, fix #1288)
  • Fix problem with route chunk names (#1461)
  • Fix asyncData with nested pages in production build (#1248)
  • Avoid setting babe.presets if build.babel.babelrc is true
  • Router base is now added to all middleware so nuxt won't conflict with other middleware (1ca5739a2f58857cecf4f7ce96f1603a0f0b51ae)
  • Fix static import in css with alias conflict (#1435)

v1.0.0-rc5 Released on

Improvements

  • Route orders is handled with wildcard, see #1275
  • nuxt generate won't sort the CSS class names by default (fix some issues with Semantic UI), see https://github.com/nuxt/nuxt.js/commit/533c8a9fb66e105ae8175bf31bff4eede5d733e1
  • Support Class Components in layouts & extended components (PR #1310 & 1342)
  • Add better support for pug (PR #1361)
  • We can now use ~/assets in style tag in vue files. (2ff8b5aaf6e3ed6f34b2f33f8840dffb9b1a0a17, #1241)
  • Prevent error with opencollective postinstall script (https://github.com/nuxt/nuxt.js/commit/a0d888d9766f0e953a3a30c07791da24a0f490e2)
  • Improve extracted CSS long term caching by using [contenthash] (#1390, c9def711fa5e6e72b886d8932ac24dbb2f7fbb7f)
  • Webpack chunk namings and hash improved (No longer meaningless 0.nuxt.bundle) (e510136a5ab0b1ec39c578bf0d75827e42b1e7f1)
  • Fix problem with nuxt-start package.json (#1378)
  • perf: Scope Hoisting now enabled for client bundles
  • perf: improved js minification using ES6 aware babel-minify and exporting banners to an external LICENSES file. (673dfcd3c997d59b74adfa6aacc844a7b0753408)

Features

  • Add process.static (equals true with nuxt generate) to know if your app is running as a static website (you can use process.server && process.static to know when the page are server rendered before being saved).
  • Add isStatic inside context
  • Store with modules now has strict: true by default in development mode to force Vuex best practices (see https://vuex.vuejs.org/en/strict.html)

Better SPA Experience

  • You can run nuxt commands in spa mode using --spa (nuxt --spa)
  • Introduce to options.mode in nuxt.config.js with 2 possible values:
    • universal (default): (server-side + client-side rendering)
    • spa: (only client-side rendering)
  • Resource Hints for SPA (7a9539e74f76fe80c7a40506fdc0337134ff4b84)
  • options.headsupport for SPA (866e31d1a6d0b921d2d4bddffac094427e529f13)
  • options.loadingIndicator for SPA loading splash with 10+ ready to use spinners out of the box.
  • Build & Deploy Apps using nuxt build --spa, the dist directory is automatically generated and ready to be deployed on pure static hostings like surge, github pages or now.
  • css sourcemaps can be disabled using options.build.cssSourceMap (Enabled on dev only by default)

See SPA example: https://spa.nuxtjs.org [source]

PostCSS

  • Working PostCSS Everywhere (5d2429459a5920a0a02ace97127bbe7b47199eea)
  • Automatically detect and support postcss.js in projects. (f0ef41962d5b2305054ddbfdaa6fe43fc147dc85)
  • cssnext, postcss-import, postcss-url is the default preset, so you can enjoy latest css features and have import support.
  • While old array style is supported, the new recommended usage is object style, so you can lazy require postcss plugins (adding in devDependencies only) and also customize default preset easier:
module.exports = {
 build: {
    postcss: {
        plugins: {
        'postcss-import': false, // Disable default postcss-import
        'cssnext' : { /* provide some options */ },
        'postcss-rtl': { } // Add your own postcss plugins
       }
    }
 } 
}

v1.0.0-rc6 Released on

Improvements

  • Use vue-meta to build meta tags for spa mode based on nuxt.config.js(39f431efdf1d68f457d0bae2b345f7f27708e36b)
  • Fix asyncData & fetch calls on spa mode with children (#1423)
  • Remove typings for TypeScript (fix #1419)
  • Fix problems with common chunk (7973d67f5b92cab4f59c54ee443ca4c1654072ce)
  • Fix sass loader with indentedSyntax (#1436, b931dd40cea828021f3092d1e224053a1baacba0)

Features

  • Experimental webpack dll support to split vendor in a way that can drastically improve dev build time performance (d7fbe47c31d30f8d4971bfe8605d92b2fc71a15c) This option is disabled by default, you can enable by setting build.dll to true in nuxt.config.js for beta testing and reporting any possible issues with this feature (don't forget to git ignore .cache/)

Released on

Bug Fixes

  • fix: revert to corejs@2 (#5317) (Pooya Parsa) (20836d93)
  • fix: remove consola.debug for hooks (#5318) (Thomas Reichling) (9ff01f9b)
  • fix: apply default lock options before setting lock (#5320) (Pim) (7c24280a)
  • fix(ts): wrong export used in render.d.ts (#5309) (Romain Lanz) (e67b2982)
  • examples: upgrade and fix typescript configuration files (#5310) (Romain Lanz) (7100a2c6)
  • chore: unsupport nuxt-legacy (pooya parsa) (797a4ce6)