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
low.js, a Node.js port for embedded systems
Welcome Express Gateway 1.11.0, a microservices API Gateway on Express.js