Question

nuxt.config

Nuxt 应用程序的起点仍然是您的 nuxt.config 文件。

Nuxt 配置将使用 unjs/jiti 和 unjs/c12 加载。

迁移步骤

Nuxt 和 Nuxt 模块现在仅限构建时。

迁移步骤

static/ 目录（用于存储静态资产）已重命名为 public/。 您可以将 static 目录重命名为 public，或者通过在 nuxt.config 中设置 dir.public 来保留名称。

相关阅读：directory-structure > public

TypeScript

如果您使用 Nuxt 的 TypeScript 集成，那么迁移您的应用程序会容易得多。 这并不意味着您需要使用 TypeScript 编写您的应用程序，只是 Nuxt 将为您的编辑器提供自动类型提示。

您可以 在文档中 阅读更多关于 Nuxt 的 TypeScript 支持的信息。

Nuxt 可以使用 vue-tsc 和 nuxi typecheck 命令对您的应用程序进行类型检查。

迁移步骤

推荐的 Vue 最佳实践有很多变化，Vue 2 和 3 之间也有一些重大变化。

建议阅读 Vue 3 迁移指南，尤其是 重大变更列表。

目前无法将 Vue 3 迁移构建 与 Nuxt 3 一起使用。

Vuex

Nuxt 不再提供 Vuex 集成。 相反，官方 Vue 建议使用 pinia，它通过 Nuxt 模块 内置了 Nuxt 支持。 在此处了解更多关于 pinia 的信息。

使用 pinia 提供全局状态管理的一种简单方法是：

安装 @pinia/nuxt 模块：

bash

yarn add pinia @pinia/nuxt

在应用程序的根目录下创建一个 store 文件夹：

store/index.ts

import { defineStore } from 'pinia'

export const useMainStore = defineStore('main', {
  state: () => ({
    counter: 0,
  }),
  actions: {
    increment() {
      // `this` is the store instance
      this.counter++
    },
  },
})

创建一个 plugin 文件来全球化您的商店：

plugins/pinia.ts

import { useMainStore } from '~/store'

export default defineNuxtPlugin(({ $pinia }) => {
  return {
    provide: {
      store: useMainStore($pinia)
    }
  }
})

如果您想继续使用 Vuex，可以按照 这些步骤 手动迁移到 Vuex 4。

完成后，您需要将以下插件添加到您的 Nuxt 应用程序中：

plugins/vuex.ts

import store from '~/store'

export default defineNuxtPlugin(nuxtApp => {
  nuxtApp.vueApp.use(store);
})