模块

模块兼容性

Nuxt 3对于使用@nuxt/kit自动包装器的Nuxt 2模块具有基本的向后兼容层。但是，通常需要遵循一些步骤使模块与Nuxt 3兼容，有时需要使用Nuxt Bridge来实现跨版本兼容性。

我们为使用@nuxt/kit编写Nuxt 3准备模块的作者准备了一份专门的指南。目前最佳的迁移路径是按照指南重写你的模块。如果你希望避免完全重写，本指南的其余部分将包括准备步骤，使模块与Nuxt 3兼容。

插件兼容性

Nuxt 3插件与Nuxt 2不完全向后兼容。

Vue兼容性

使用组合式API的插件或组件需要独占Vue 2或Vue 3支持。

通过使用vue-demi，它们应该与Nuxt 2和3兼容。

模块迁移

当Nuxt 3用户添加你的模块时，你将无法访问模块容器 (this.*)，因此你需要使用@nuxt/kit中的工具来访问容器功能。

使用@nuxt/bridge进行测试

迁移到@nuxt/bridge是支持Nuxt 3的第一个和最重要的步骤。

如果你的模块中有一个fixture或示例，请将@nuxt/bridge包添加到其配置中（参见示例）。

从CommonJS迁移到ESM

Nuxt 3原生支持TypeScript和ECMAScript模块。请查看Native ES Modules获取更多信息并进行升级。

确保插件的默认导出

如果你注入的Nuxt插件没有export default（如全局Vue插件），请确保在末尾添加export default () => { }。

// ~/plugins/vuelidate.js
import Vue from 'vue'
import Vuelidate from 'vuelidate'

Vue.use(Vuelidate)

避免运行时模块

在Nuxt 3中，Nuxt现在只是构建时的依赖项，这意味着模块不应该尝试与Nuxt运行时进行挂钩。

即使只将模块添加到buildModules（而不是modules），你的模块也应该正常工作。例如：

• 避免在Nuxt模块中更新process.env并由Nuxt插件读取；使用runtimeConfig代替。
• (*) 避免依赖于生产环境中的运行时钩子，如vue-renderer:*
• (*) 避免通过在模块内部导入它们来添加serverMiddleware。相反，通过引用文件路径添加它们，以使它们独立于模块的上下文

(*) 除非仅用于nuxt dev目的，并通过if (nuxt.options.dev) { }进行保护。

使用TypeScript（可选）

虽然不是必需的，但大部分Nuxt生态系统正在转向使用TypeScript，因此强烈建议考虑迁移。