chore(deps): update dependency nuxt to v3.9.0 #53
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR contains the following updates:
3.2.2
->3.9.0
Release Notes
nuxt/nuxt (nuxt)
v3.9.0
Compare Source
👀 Highlights
A very merry Christmas to you and yours from all Nuxters involved in this release! 🎁🎄
We have lots of features packed into v3.9.0 and can't wait for you to try them out.
⚡️ Vite 5
This release comes with Vite 5 and Rollup 4 support. Module authors may need to check to ensure that any vite plugins you're creating are compatible with these latest releases.
This comes with a whole host of great improvements and bug fixes - check out the Vite changelog for more info.
✨ Vue 3.4 ready
This release is tested with the latest Vue 3.4 release candidate, and has the necessary configuration to take advantage of new features in Vue 3.4, including debugging hydration errors in production (just set
debug: true
) in your Nuxt config.👉 To take advantage, just update your
vue
version once v3.4 is released, or try out the release candidate today:🏝️ Interactive Server Components
This is a highly-experimental update, but it's now possible to play around with interactive components within Nuxt server components. You'll need to enable this new feature additionally to component islands:
Now, within a server component, you can specify components to hydrate by using the
nuxt-client
directive:We're pretty excited about this one - so do let us know how you're using it! 🙏
🔥 Automatic Server Optimisations
We now use Vite's new AST-aware 'define' to perform more accurate replacements on server-side code, meaning code like this will no longer throw an error:
This hasn't been possible until now because we haven't wanted to run the risk of accidentally replacing normal words like
document
within non-JS parts of your apps. But Vite's newdefine
functionality is powered byesbuild
and is syntax-aware, so we feel confident in enabling this functionality. Nevertheless, you can opt out if you need to:🚦 Granular Loading API
We now have a new hook-based system for
<NuxtLoadingIndicator>
, including auseLoadingIndicator
composable that lets you control/stop/start the loading state. You can also hook intopage:loading:start
andpage:loading:end
if you prefer.You can read more in the docs and in the original PR (#24010).
🏁 Run single events in
callOnce
Sometimes you only want to run code once, no matter how many times you load a page - and you don't want to run it again on the client if it ran on the server.
For this, we have a new utility:
callOnce
(#24787).Note that this utility is context-aware so it must be called in component setup function or Nuxt plugin, as with other Nuxt composables.
Read more in the docs.
🚨 Error Types
For a while now, errors returned by
useAsyncData
anduseFetch
have been typed pretty generically asError
. We've significantly improved the type possibilities for them to make them more accurate in terms of what you'll actually receive. (We normalise errors with theh3
createError
utility under the hood, so they can be serialised from server to client, for example.)We've tried to implement the type change in a backwards compatible way, but you might notice that you need to update the generic if you're manually configuring the generics for these composables. See (#24396) for more information, and do let us know if you experience any issues.
🔥 Schema Performance
We've taken some time in this release to make some minor performance improvements, so you should notice some things are a bit faster. This is an ongoing project and we have ideas for improving initial load time of the Nuxt dev server.
✅ Upgrading
As usual, our recommendation for upgrading is to run:
This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the unjs ecosystem.
👉 Changelog
compare changes
🚀 Enhancements
<NuxtLayout>
(#24116)addComponentsDir
(#24309)useCookie
(#24503)error.data
when throwing 404 errors (#24674)/module
or/nuxt
module subpath if it exists (#24707)refresh
on islands and server components (#24261)dedupe
option for data fetching composables (#24564)undefined
on server (#24711)addServerScanDir
composable (#24001)setup
withindefineComponent
options (#24515)useRequestHeader
utility (#24781)callOnce
util to allow running code only once (#24787)NuxtIsland
(#22649)bundler
module resolution (#22821)toArray
util (#24857)🔥 Performance
resolve
operation (#24736)join
operation (#24717)get
operations (#24734)useRuntimeConfig
call (#24843)JSON.stringify
operation (#24848)🩹 Fixes
import.d.ts
(#24413)reactivityTransform
(vue 3.4) (#24477)<DevOnly>
(#24511)isBuiltin
polyfill for greater node support (#24512)<NuxtLayout>
usage in islands (#24529)error
inuseAsyncData
has correct type (#24396)appManifest
middleware after modules run (#24786)setup
withindefineComponent
(#24784)__VUE_PROD_HYDRATION_MISMATCH_DETAILS__
(#24836)mode
fromfilePath
foraddComponent
(#24835)bundler
module resolution due to lack of support (22ce98d61)~/modules
dirs tomodulesDir
(#24457)💅 Refactors
defineComponent
to infer prop types for router-link stub (dc0e8347b)jiti.import
for schema (#24526)process.*
usage in nuxt vue app (#24749)future
andfeatures
namespace (#24880)📖 Documentation
typedPages
(#24436)defineNuxtConfig
to deployment example (#24451)~
to@
alias in examples (#24574)-o
option to--open
(#24644)<NuxtPage>
(#24675)getCachedData
option (#24697)addServerScanDir
example (7cd02e290)loadNuxt
options (#24201)nuxi module
(#24790)useFetch
anduseAsyncData
#24407 (#24775, #24407)addComponentsDir
example to modules author guide (#24876)🏡 Chore
dev:prepare
instead ofbuild:stub
(802b3e28c)✅ Tests
🤖 CI
nuxt/bridge
when composables change (#24752)❤️ Contributors
v3.8.2
Compare Source
👀 Highlights
3.8.2 is a patch release and we've deferred some exciting features in our next release (3.9.0, expected in December) but it does bring a significant Nitro minor release: v2.8.0. It's well worth checking out the release notes.
👉 Note that as Nitro has updated to rollup v4, but as Nuxt's vite dependency is still on rollup v3 until v3.9, you may experience type mismatches in modules or your projects if you are dependent on particular rollup plugins or plugin types.
✅ Upgrading
As usual, our recommendation for upgrading is to run:
This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the unjs ecosystem.
👉 Changelog
compare changes
🩹 Fixes
transformAssetUrls
(#24173)createError
(#24093)plugins.d.ts
if they will be written (#23943)typeof
optimisations (#23903)KeepAlive
cache (#24024)runtimeConfig
type hints (#23696)useFetch
key (#24307)useFetch
key from headers (#23462, #24333)ignoreOptions
(#24337)useFetch
(#24364)useCookie
timeout (#24253)app:error
(#24376)📖 Documentation
import.meta
(#24186).nuxtrc
innuxt/starter
(56147b4a8)defineNuxtPlugin
syntax in bridge migration (#23036)nuxt3-vuex-module
in migration guide (#24260).gitignore
in directory structure (#24338)app.config
placement with customsrcDir
(#24252)<ContentDoc>
in example (#24244)@nuxt/kit-nightly
in example (bdedc3207)nuxi-edge
tonuxi-nightly
(#24347)🏡 Chore
@nuxt/test-utils
to separate repo (#24146)repository
fields inpackage.json
(54529c17d)package.json
s (#24189)@nuxt/eslint-config
(#24209)✅ Tests
❤️ Contributors
v3.8.1
Compare Source
👉 Changelog
compare changes
🔥 Performance
pages
on nuxt app and deduplicate calls (#24032)🩹 Fixes
extends
(#23795)target: blank
links with base (#23751)std-env
to detect whether app is being tested (#23830).json
extension for server components (#23802)@unhead/vue
in template code (#23858)baseURL
(#23884)cloneDeep
again (#23888)$fetch
at entry start (#23906)postcss-url
and duplicatepostcss-import
(#23861)useCookie
value when it expires (#23549)h3
cors handler for vite routes only (#23995)addServerImportsDir
implementation (#24000)isChangingPage
util in scrollBehavior (#24091)useCookie
(#24043)ClientFallback
(#24086)typeCheck
plugin (#24114)💅 Refactors
useRequestEvent()
internally (#23916)📖 Documentation
useFetch
key generation logic (#24082)addPrerenderRoutes
name (#24102)🏡 Chore
✅ Tests
NuxtIsland
(#23801)🤖 CI
❤️ Contributors
v3.8.0
Compare Source
👀 Highlights
We have a lot of exciting features in v3.8, and can't wait for you to try it out.
💻 Nuxi improvements
Just to remind you, we're now using the new Nuxt CLI which is now versioned separately. There are some exciting improvements there to follow, so do check out the latest releases. (For example, we now share the same port with the Vite websocket, meaning better support for docker containers in development.)
🚨 Built-in Nuxt DevTools
Nuxt DevTools v1.0.0 is out and we now think it's ready to be shipped as a direct dependency of Nuxt.
👉 You can check out the release notes for more information - and stay tuned for an article detailing our roadmap for the future.
📸 Nuxt Image auto-install
We've now made
<NuxtImg>
and<NuxtPicture>
first-class built-in components, documenting them and auto-installing@nuxt/image
the first time that they are used (#23717).autoinstall2.mp4
We would definitely advise using
@nuxt/image
if you're using images in your site; it can apply optimisations to make your site more performant.📂 Deeper layout scanning
🚨 This is a behaviour change so do take care with this one: 🚨
We now support scanning layouts within subfolders in
~/layouts
in the same way as we do with~/components
.File | Layout name
-- | --
~/layouts/desktop/default.vue | 'desktop-default'
~/layouts/desktop-base/base.vue | 'desktop-base'
~/layouts/desktop/index.vue | 'desktop'
See #20190 for more information
📊 App Manifest
We now support a built-in app manifest (see #21641), which generates a manifest at
/_nuxt/builds/meta/<buildId>.json
.Initially this enables loading payloads only for prerendered routes, if a site is static (preventing 404s). It also enables client-side route rules. To begin with, only
redirect
route rules will have an effect; they will now redirect when performing client-side navigation. (More coming soon...!)The app manifest also enables future enhancements including detection of outdated deployments by checking
/_nuxt/builds/latest.json
.You can switch off this behaviour if you need to (but do let us know if you have any issues):
🤝 Scope and context improvements
We now define a 'scope' for Nuxt composables executed in plugins (#23667), which allows running synchronous cleanup before navigating away from your site, using the Vue
onScopeDispose
lifecycle method. This should fix an edge case with cookies (#23697) and also improves memory management, for example in Pinia stores (#23650). You can read more about Vue effect scopes.We also now support native async context for the Vue composition API (#23526). In case you're unaware, we support native async context on Node and Bun, enabled with
experimental.asyncContext
. This can help address issues with missing a Nuxt instance. But it didn't previously affect missing Vue instances.If you experience issues with 'Nuxt instance unavailable', enabling this option may solve your issues, and once we have cross-runtime support we are likely to enable it by default.
🔗 NuxtLink defaults
We've supported defining your own
NuxtLink
components with thedefineNuxtLink
utility. We now support customising the options for the built-in<NuxtLink>
, directly in yournuxt.config
file (#23724). This can enable you to enforce trailing slash behaviour across your entire site, for example.⚡️ Data fetching improvements: deep and caching
We have two very significant new features for
useAsyncData
anduseFetch
:deep: false
to prevent deep reactivity on thedata
object returned from these composables (#23600). It should be a performance improvement if you are returning large arrays or objects. The object will still update when refetched; it just won't trigger reactive effects if you change a property deep within thedata
.getCachedData
option to handle custom caching for these composables (#20747)We also support configuring some default values for these composables in an app-wide way (#23725):
🔢 Layer improvements
We now more carefully load layer plugins (#22889 and #23148) and middleware (#22925 and #23552) in the order of the layers, always loading your own plugins and middleware last. This should mean you can rely on utilities that layers may inject.
We've also added a test suite to cover these layer resolution changes.
And probably one of the most significant changes - if you are using remote layers we now clone these within your
node_modules/
folder (#109) so layers can use dependencies with your project. Seec12
release notes for full details.😴 Nightly release channel
Every commit to the
main
branch of Nuxt is automatically deployed to a new release, for easier testing before releases. We've renamed this from the 'edge release channel' to the 'nightly release channel' to avoid confusion with edge deployments. And probably also with Microsoft Edge (though I haven't heard that anyone was confused with that one!)➡️
nuxt3
is nownuxt-nightly
➡️
nuxi-edge
is nownuxi-nightly
➡️
@nuxt/kit-edge
is now@nuxt/kit-nightly
... and so on.
You can read more about how it works.
⚗️ Nitro v2.7
Nitro v2.7 has been released with lots of improvements and bug fixes - do check out the full changelog.
🔥 One of the most significant is that we now save ~40% of bundle size in production by using native
fetch
(which is supported in Node 18+) (#1724). So if possible, we'd recommend you update your Node version to at least 18.💪 Type import changes
🚨 This is likely to need code changes in your project 🚨
Vue requires that type imports be explicit (so that the Vue compiler can correctly optimise and resolve type imports for props and so on). See core Vue
tsconfig.json
.We've therefore taken the decision to turn on
verbatimModuleSyntax
by default in Nuxt projects, which will throw a type error if types are imported without an explicittype
import. To resolve it you will need to update your imports:You may also encounter modules in the Nuxt ecosystem that need to be updated; please open an issue for those modules. I'm also very happy to help if you're encountering any problems with this, if you're a module author. Just tag me and I'll take a look.
If for whatever reason you need to undo this change in your project you can set the following configuration:
However, we'd recommend only doing that temporarily, as Vue does need this option to be set for best results.
✅ Upgrading
As usual, our recommendation for upgrading is to run:
👉 Changelog
compare changes
🚀 Enhancements
addServerImports
andaddServerImportsDir
(#23288)prerenderRoutes
ssr composable (#22863)appManifest
by default (#23448)withAsyncContext
(#23526)-nightly
extension (#23508)@nuxt/devtools
as dependency and enable (#23576)deep: false
for data composables (#23600)@nuxt/image
when it is used (#23717)<NuxtLink>
options (#23724)🔥 Performance
🩹 Fixes
asyncData
errors withnull
(#23428)vue-router
(#23440)config.autoImport
inaddServerImports
(#23472)clearNuxtState
called w/o keys (#23483)addPrerenderRoutes
name (#23509)test
/dev
as manifest buildId when appropriate (#23512)<DevOnly>
(#23466)useFetch
(#23693)lodash-es
+ simplify postcss resolution (#23692)useAsyncData
(#23351)prerenderedAt
to override app manifest (#23781)prerenderedAt
behaviour pending next patch (108b1bdf7)📖 Documentation
listhen
options on nuxi dev page (#23415)handler
foruseAsyncData
(#23389)nitro
to useruntimeConfig
(#23454)bridge.typescript
option must be set. (#23503)nuxt kit
section (#22375)/edge-channel
page to/nightly-release-channel
(#23648)routeRules
example (818dc626c)<NuxtImg>
and<NuxtPicture>
(#23741)🏡 Chore
✅ Tests
🤖 CI
❤️ Contributors
Configuration
📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).
🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.
♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about these updates again.
This PR has been generated by Mend Renovate. View repository job log here.