2 min read

Last week, the Nuxt.js community announced the release of Nuxt.js 2.0 with major improvements. This release comes with a scaffolding tool, create-nuxt-app to quickly get you started with Nuxt.js development. To provide a faster boot-up and re-compilation, this release is upgraded to Webpack 4 (Legato) and Babel 7.

Nuxt.js is an open source web application framework for creating Vue.js applications. You can choose between universal, static generated or single page application.

What is new in Nuxt.js 2.0?

Introduced features and upgradations

create-nuxt-app

To get you quickly started with Nuxt.js development, you can use the newly introduced create-nuxt-app tool. This tool includes all the Nuxt templates such as starter template, express templates, and so on. With create-nuxt-app you can choose between integrated server-side framework, UI frameworks, and add axios module.

Introducing nuxt-start and nuxt-legacy

To start Nuxt.js application in production mode nuxt-start is introduced. To support legacy build of Nuxt.js for Node.js < 8.0.0,  nuxt-legacy is added.

Upgraded to Webpack 4 and Babel 7

To provide faster boot-up time and faster re-compilation, this release uses Webpack 4 (Legato) and Babel 7.

ESM supported everywhere

In this release, ESM is supported everywhere. You can now use export/import syntax in nuxt.config.js, serverMiddleware, and modules.

Replace postcss-next with postcss-preset-env

Due to the deprecation of cssnext, you have to use postcss-preset-env instead of postcss-cssnext.

Use ~assets instead of ~/assets

Due to css-loader upgradation, use ~assets instead of ~/assets for alias in <url> CSS data type, for example, background: url(“~assets/banner.svg”).

Improvements

  • The HTML script tag in core/renderer.js is fixed to pass W3C validation.
  • The background-color property is now replaced with background in loadingIndicator, to allow the use of images and gradients for your background in SPA mode.
  • Due to server/client artifact isolation, external build.publicPath need to upload built content to .nuxt/dist/client directory instead of .nuxt/dist.
  • webpackbar and consola provide a improved CLI experience and better CI compatibility.
  • Template literals in lodash templates are disabled.
  • Better error handling if the specified plugin isn’t found.

Deprecated features

  • The vendor array isn’t supported anymore.
  • DLL support is removed because it was not stable enough.
  • AggressiveSplittingPlugin is obsoleted, users can use optimization.splitChunks.maxSize instead.
  • The render.gzip option is deprecated. Users can use render.compressor instead.

To read more about the updates, check out Nuxt’s official announcement on Medium and also see the release notes on its GitHub repository.

Read Next

Next.js 7, a framework for server-rendered React applications, releases with support for React context API and Webassembly

low.js, a Node.js port for embedded systems

Welcome Express Gateway 1.11.0, a microservices API Gateway on Express.js

Bhagyashree R