Nuxt 3.4 发布，基于 Vue 3 的 Web 框架

Nuxt 是使用简便的 Web 框架，用于构建现代和高性能的 Web 应用，可以部署在任何运行 JavaScript 的平台上。去年发布的 Nuxt 3 基于 Vue 3 构建，为 TypeScript 提供了 “一等公民” 支持，并进行了一次彻底的重构，对内核进行了精简，速度更快，体验更好。

近日发布的 Nuxt 3.4.0 则是 Nuxt 3 的最新版本，带来了令人兴奋的新功能，包括对 View Transitions API 的支持、将丰富的 JavaScript 有效负载 (JavaScript payload) 从服务器传输到客户端等等。

Nuxt 3.4.0 主要变化

• 支持 View Transitions API

基于 Chromium 的浏览器提供了一个新的 Web 平台 API：View Transitions API。这是原生浏览器转换的新功能，可以在不同页面上的不相关元素之间进行转换。

Nuxt 现在提供了一个实验性实现，它将在 v3.4 发布周期中积极开发。

export default defineNuxtConfig({
  experimental: {
    viewTransition: true
  }
})

• Payload 增强

新版本对 Nuxt 处理有效负载的方式进行了重大更改（需启用实验性 flag）。有效载荷用于在进行服务器端渲染时将数据从服务器发送到客户端，并避免在 hydration 阶段重复获取数据。

export default defineNuxtConfig({
  experimental: {
    renderJsonPayloads: true
  }
})

• 支持对象语法 (Object-syntax) Nuxt 插件

现在已支持对象语法 Nuxt 插件，以便更好地控制插件顺序，并更轻松地注册钩子。

export default defineNuxtPlugin({
  name: 'my-plugin',
  enforce: 'pre', // or 'post'
  async setup (nuxtApp) {
    // this is the equivalent of a normal functional plugin
  },
  hooks: {
    // You can directly register Nuxt app hooks here
    'app:created'() {
      const nuxtApp = useNuxtApp()
      // 
    }
  }
})

未来将根据开发者在 Nuxt 插件中传递的元数据启用构建优化。

• 简化开发工具配置

现在在项目启用 Nuxt DevTools 变得更容易：只需在nuxt.config文件中设置devtools: true即可启用开发者工具。

export default defineNuxtConfig({
  devtools: true
})

如果尚未安装，Nuxt 将提示在本地安装它。这意味着无需全局启用 Nuxt DevTools。

• 优化 Layers
• 更好的上下文切换
• ……

详情查看发布公告。