创建你的第一个模块

创建模块

我们建议你使用我们的启动模板来开始 Nuxt 模块开发：

npm create nuxt -- -t module my-module

yarn create nuxt -t module my-module

pnpm create nuxt -t module my-module

bun create nuxt --template=module my-module

这会创建一个 my-module 项目，包含开发和发布你的模块所需的全部样板代码。

后续步骤：

1. 在你喜欢的 IDE 中打开 my-module
2. 使用你喜欢的包管理器安装依赖
3. 使用 npm run dev:prepare 准备本地文件以供开发
4. 阅读本文档以了解更多关于 Nuxt 模块的内容

使用启动模板

学习如何使用模块启动模板执行基本任务。

开发你的模块

虽然你的模块源码位于 src 目录中，但在开发模块时，你通常需要一个 Nuxt 应用来测试它。这就是 playground 目录的用途。它是一个 Nuxt 应用，你可以随意调试，并且已经配置为与你的模块一起运行。

你可以像对待任何 Nuxt 应用一样与 playground 交互。

• 用 npm run dev 启动它的开发服务器，当你在 src 目录中修改模块时，它应该会自动重新加载
• 用 npm run dev:build 构建它

运行测试

模块启动模板附带一个基本的测试套件：

• 由 ESLint 驱动的 linter，使用 npm run lint 运行
• 由 Vitest 驱动的测试运行器，使用 npm run test 或 npm run test:watch 运行

构建你的模块

Nuxt 模块自带由 @nuxt/module-builder 提供的专属构建器。这个构建器不需要你做任何配置，支持 TypeScript，并确保你的资源被正确打包以便分发给其它 Nuxt 应用。

你可以通过运行 npm run prepack 来构建你的模块。

发布到 npm

虽然你可以通过提升版本号并使用 npm publish 命令来发布你的模块，但模块启动模板附带了一个发布脚本，可帮助你确保发布一个可用的模块版本到 npm，以及更多功能。

要使用发布脚本，首先，提交你所有的更改（我们建议使用 Conventional Commits，以便同时利用自动版本号提升和变更日志更新），然后用 npm run release 运行发布脚本。

运行发布脚本时，会发生以下事情：

• 首先，它会运行你的测试套件：
  • 运行 linter（npm run lint）
  • 运行单元、集成和 e2e 测试（npm run test）
  • 构建模块（npm run prepack）
• 然后，如果你的测试套件顺利通过，它会继续发布你的模块：
  • 根据你的 Conventional Commits 提升模块版本号并生成变更日志
  • 将模块发布到 npm（为此，模块会被再次构建，以确保更新后的版本号被纳入发布的产物中）
  • 推送一个代表新发布版本的 git tag 到你的 git 远程 origin