Bot releases are visible (Hide)
vue-renderer
vue-app
console.log
cli
typescript
pages/
creation when default page displayedvue-renderer
User-Agentโ
to Vary
header in modern server modeserver
builder
pages/
creation when default page displayedgenerator
types
babel.presets
vue-app
watchQuery
fixPrepatch
in-out transition fix (issue #5797)utils
serializeFunction
edge casevue-renderer
render.injectScripts
optionrender.ssrLog
for controlling SSR logscore
require.resolve
instead of Module
internalsbuilder
nuxtOptions
vue-app
general
auth-jwt
typescript
ci
general
general
core/resolver.js
packages/core/test/resolver
Published by pi0 over 5 years ago
style
property when resolving (jsless/postcss-import-resolver#2)Published by pi0 over 5 years ago
We all know the console.log
debugging method, but when working with universal applications, you have to remember that sometimes, your logs are in your terminal and not in your browser console.
This can be really annoying when developing a Nuxt.js application, starting with this version and running nuxt dev
, the ssr logs are now reported to your browser console:
store/
creation ๐Nuxt.js now detects when you created a store/
directory and will reload himself auto-magically so you don't have to restart it anymore.
PS: We also improved the serverMiddleware
watch to restart Nuxt.js and clean their cache
watch:restart
after watch:fileChanged
hook (#5620)watchQuery
option in routerViewKey
(#5516)spa:templateParams
hook (#5619)HardSourcePlugin
(#5653)serverMiddleware
paths (#5681)transition
to pageTransition
and deprecate it (#5558)babel.presets
and babel envName
(#5637)core-js@3
example in the readme (#5633)Only for typescript users, Nuxt.js v2.7 dropped support for node < 8.6 relate to ts-loader v6
context.app
type (#5701)extendRoutes
method type (#5700)ts-node
to register twice (#5699)Published by pi0 over 5 years ago
nuxt.config
(#5574)req
and res
types (#5560)Published by pi0 over 5 years ago
nuxt.config.js
changes and watch for all imported files (#5500)tsconfig.json
but do not use typescript (#5478)nuxt dev
(#5514)modulepreload
for modern mode when using spa generate (#5489)@nuxtjs/style-resources
package (#5499)router.base
support for banner url and loading screen (#5470) (nuxt/loading-screen#8)vuex-router-sync
(nuxt/devalue#8) (vuejs/vuex-router-sync#89)Published by pi0 over 5 years ago
This version is addressing most of the problems of 2.5 and is without any breaking changes. For most of the users, a normal version upgrade would be enough. However, reading this guide can help to have a smooth upgrade.
yarn.lock
, package-lock.json
and node_modules
yarn outdated
command can be used.Because of how package managers (yarn, npm) work, a wrong version of a dependency from one of the other dependencies may be hoisted into node_modules
. Nuxt is strict about this and provides instructions for dependency resolution so please follow it.
The well-known problem is with firebase
package that requires to manually install node-fetch
dependency in your project.
We accidentially introduced a change that broke the prod build for many people who are using Nuxt programatically. This has been resolved through #5413. Sorry for the inconveniences!
Since core-js@2
and core-js@3
are both supported from babel 7.4.0, Starting from 2.6 Nuxt supports both versions (#5411). It is highly advised to stick with 2 (default) unless having a special dependency that needs 3. (Instructions for core-js@2
are not required but recommended)
core-js@2
yarn add -D core-js@2 @babel/runtime-corejs2
npm i -D core-js@2 @babel/runtime-corejs2
core-js@3
yarn add -D core-js@3 @babel/runtime-corejs3
npm i -D core-js@3 @babel/runtime-corejs3
Edit nuxt.config.js
:
export default {
build: {
babel: {
presets({ isServer }) {
return [
[
require.resolve('@nuxt/babel-preset-app'),
// require.resolve('@nuxt/babel-preset-app-edge'), // For nuxt-edge users
{
buildTarget: isServer ? 'server' : 'client',
corejs: { version: 3 }
}
]
]
}
}
}
}
Nuxt 2.5 users may only require to add ts-node
to the dependencies
Beta Testers : Replace
nuxt
bynuxt-edge
, and@nuxt/typescript
by@nuxt/typescript-edge
in the following instructions.
nuxt-ts
dependency (2.4 users only)
yarn remove nuxt-ts
npm remove nuxt-ts
nuxt
and ts-node
to dependencies
:
yarn add nuxt ts-node
npm i nuxt ts-node
@nuxt/typescript
to devDependencies
:
yarn add -D @nuxt/typescript
npm i -D @nuxt/typescript
tsconfig.json
file. Nuxt will automatically generate it with defaults at first run, then you can edit it to fit your needs--quiet
option to nuxt generate
command (#5357) (Franck Abgrall) (91f4eb04)tsconfig.json
(#5412) (Pooya Parsa) (6ffc5c57)babel.config.js
by default (#5365) (Xin Du (Clark)) (64fa4244)getlocation
(#5337) (Johan Roxendal) (77dcfe6e)unsafe-inline
hasn't been specified (#5387) (Sam Bowler) (97db6a4b)Published by pi0 over 5 years ago
Published by Atinux over 5 years ago
15,000 line changes with 230 squashed commits by more than 30 contributors made this version possible! โค๏ธ
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 7.4, Core-js v3, and Object.assign
polyfill for better browser support.
More than 30 fixes, refactors and performance improvements.
Use nuxt dev -o
to instantly open project in the browser and enjoy a cool loading screen:
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
For a clean upgrade, please remove yarn.lock
/ package-lock.json
file from your project before upgrade.
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()
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"
}
build.useForkTsChecker
to build.typescript.typeCheck
. Please see #5079 for more details.build: {
-- useForkTsChecker: false // or ForkTsChecker options
++ typescript : {
++ typeCheck: false // or ForkTsChecker options
++ }
}
es6.object.assign
by default (Clark Du) (52fe145a).nuxtignore
(#4647) (Xin Du (Clark)) (59be77a2)devModules
option (#5102) (Jonas Galvez) (e87711c5)isClient
, isServer
, isStatic
(#5211) (Daniel Hritzkiv) (29c3c425)config.entry
(fixes #4849) (#5236) (Julien Dargelos) (82167651)futureEmitAssets
(#5003) (Alexander Lichter) (3997d504)nuxt-ts start
(#4906) (Kevin Marrec) (17cc12f0)Published by pi0 over 5 years ago
v2.4.5 (2019-02-26)
asyncData
memory leak on client-side (#4966) (4086800)getNuxtChildComponents
method (#4969) (dbf7099)Published by pi0 over 5 years ago
terser-webpack-plugin
to ^1.2.2
.webpack
to ^4.29.2
serializeFunction
for external imports (#4916)Published by manniL over 5 years ago
async
components correctly when using nuxt-ts
(PR #4886)extractCSS
in dev
mode (PR #4892)linkPrefetchedClass
(PR #4893)Published by Atinux over 5 years ago
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.
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 ๐
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 ๐
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:
config/
directory and autocompleteStarting 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:
We strongly invite you to read the RELEASE_PLAN.md for further details.
We want to specially thanks:
TypeScript support has landed!
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.
โ ๏ธ 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
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.
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.
store/
๐Save more development time with full HMR support for the store (
mutations
,getters
, andactions
).
This feature has been implemented by @manniL & @Atinux on PRs #4589, #4582 and #4791
If you are using VS Code, with this version, you will now have autocomplete for Nuxt.js components:
This feature has been implemented by @octref & @Atinux on PR #4524
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:
In production it will throw an error instead to avoid unwanted behavior:
This feature has been implemented by @ricardogobbosouza on PR #4428 with the help of @pi0 and @manniL.
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.
This feature has been implemented by @pi0 in PR #4669
When running nuxt start
, Nuxt will automatically detect if you built your app modern mode enabled. No need to run nuxt start --modern
explicitly anymore ๐
This detection was created by @clarkdo on PR #4422
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
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.
โ ๏ธ 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.
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.
This feature has been implemented by @manniL on PR #4417.
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.
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.
process.modern
can be used for distinguishing modern environment.server.timing
to give Server-Timing header, useful for monitoring and performances overview (PR #4800)HardSourceWebpackPlugin
by hardSource: true
in hardSource
of nuxt.config.js
scrollToTop
to false
in pages (PR #4564)nuxt-link
and nuxt-child
(n-link
and n-child
) are available now (PR #4525)PascalCase
as recommended by the Vue styleguide (PR #4396)headAttrs
are now supported for the appTemplate (PR #4536)crossorigin
attribute (PR #4472)compression
middleware (PR #4381)FriendlyErrorsWebpackPlugin
overlay (PR #4381)exclude
option to exclude pages from being generated
(in static mode) but still get rendered via fallback/SPA (PR #4754)build.hotMiddleware.client
(PR #4796)runInNewContext: true
for nuxt dev (#4508)middleware
correctly when using Vue.extend
in layout (fix #4724)undefined
script in modern mode & generated (https://github.com/nuxt/nuxt.js/commit/0a21d4b34ca2f3bde2a54452f3d6831a0b1ee362)publicPath
is falsy (PR #4365)$nuxt.$loading
typedefs (#4778)loading
property to Component options (#4786)Published by pi0 almost 6 years ago
Thanks to @clarkdo and @ederchrono for this fix โค๏ธ
Published by manniL almost 6 years ago
(Please skip v2.3.3
release. It was mistaken.)
nuxt-start
command should always start nuxt in production mode (#4384)modern=true
or false
didn't work as expected (#4378)triggerScroll
event after changing the layout (#4399)0
values for progress bar attributes (#4397)vue-router
from 3.0.1
to 3.0.2
(#4394)@nuxt/friendly-errors-webpack-plugin
from 2.3.0
to 2.3.2
mini-css-extract-plugin
from 0.4.4
to 0.4.5
webpack
from 4.26.0
to 4.26.1
vue-meta
from v1.5.5
to v1.5.6
opencollective
dependency from nuxt-start
(#4415)lodash
dependency from packages to reduce the nuxt-start
size (#4411)Published by Atinux almost 6 years ago
publicPath
is falsy (#4365)Published by pi0 almost 6 years ago
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!
nuxt.config.js
(PR #4208)routes.js
(#4121)build.extractCSS.allChunks
(#4097)require.resolve
to get the path of babel-loader (#4150)postcss.order
to change order of postcss plugins(#4318)nuxt help [cmd]
) (#4248)nuxt --help
(#4245)nuxt.config.js
(#4021)styleResources
because of performance issues. Use our new community module instead (it's a drop-in replacement) (#4302)asyncData
, fetch
and middleware
methods. Use Promises or async/wait instead. (#4256)@nuxt/core
, @nuxt/server
and @nuxt/vue-renderer
(#4202)@nuxt/builder
and @nuxt/webpack
(#4171)@nuxtjs/babel-preset-app
into nuxt mono-repo and republish it as @nuxt/babel-preset-app
(#4205)@nuxt/config
(#4212)eslint-config
into own package (#4108)Published by Atinux about 6 years ago
--no-generate
option to nuxt build
with SPA mode (PR #4127)Published by clarkdo about 6 years ago
<nuxt-child/>
accepts keep-alive-props
as props of keep-alive
(PR #4067)Published by Atinux about 6 years ago
loading.throttle
as an option (PR #3953)undefined
values in vuex store (PR #3913)