Dewdew logo-mobile
Uses
Tech
Guestbook

Nuxt 3.11 is Out! The last minor update before Nuxt 4 is released.

New features added in latest 3.11 version of Nuxt3!

nuxt3 vue3 nuxt3 feature nuxt3 news nuxt3 blog nuxt3 composables
dewdew

Dewdew

Mar 22, 2024

2 min read

cover

Nuxt v3.11 is Out!

Nuxt v3.11 has been released!

In this minor version, new features have been added before Nuxt 4. Let’s take a look at the new features that I’m keeping an eye on.


New feature in v3.11

1. Better logging

Nuxt 3.11 has improved the logging system.

Server-side logging and client-side logging are distinguished as follows.

<script setup lang="ts">
console.log('Log from index page')

const { data } = await useAsyncData(() => {
  console.log('Log inside useAsyncData')
  return $fetch('/api/test')
})

</script>
Log from index page
[ssr] Log inside useAsyncData 
    at pages/index.vue

2. Newest clear data fetching utility

Now, with the clear utility in useFetch and useAsyncData, you can cancel data requests in the necessary hooks.

<script setup lang="ts">
const { data, clear } = await useFetch('/api/test')

const route = useRoute()

watch(() => route.path, (path) => {
  if (path === '/') clear()
})

</script>

3. Can create server-side and client-side pages.

With this release, Nuxt allows you to create pages specifically for the server or client. You can create pages suited for each environment by using the .server.vue or .client.vue suffixes on your pages.


That’s all!

Other performance improvements and enhancements in handling public assets have been made.

Although there were no significant feature additions since this is the last minor release before Nuxt4, Main release of Nuxt4 is a highly anticipated update.

See you nuxt! (not next)


Reference

Dewdew of the Internet © 2024