创建你的第一个模块

创建模块

我们建议你使用我们的入门模板:

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

来开始创建 Nuxt 模块。这将创建一个 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）
  • 运行单元、集成和端到端测试（npm run test）
  • 构建模块（npm run prepack）
• 然后，如果您的测试套件运行顺利，它将继续通过以下方式发布您的模块：
  • 根据您的 Conventional Commits 增加模块版本并生成更改日志
  • 将模块发布到 npm（为此目的，模块将再次构建，以确保其更新后的版本号在已发布的工件中得到考虑）
  • 将代表新发布版本的 git 标签推送到您的 git 远程源