nuxt-modules

Nuxt モジュール開発

フレームワークの機能を拡張する Nuxt モジュールの作成ガイドです。

関連スキル： nuxt（基本）、vue（ランタイムパターン）

クイックスタート

npx nuxi init -t module my-module
cd my-module && npm install
npm run dev        # Start playground
npm run dev:build  # Build in watch mode
npm run test       # Run tests

利用可能なガイダンス

• references/development.md - モジュールの構成、defineNuxtModule、Kit ユーティリティ、フック
• references/testing-and-publishing.md - E2E テスト、ベストプラクティス、リリース、公開
• references/ci-workflows.md - コピーして使える CI/CD ワークフローテンプレート

ファイルの読み込み

タスクに応じて、これらのリファレンスファイルを読み込んでください。

• references/development.md - モジュール機能の開発、defineNuxtModule の使用、Kit ユーティリティの利用に関する作業の場合
• references/testing-and-publishing.md - E2E テストの作成、npm への公開、ベストプラクティスの実践に関する作業の場合
• references/ci-workflows.md - モジュールの CI/CD ワークフローを設定する場合

すべてのファイルを一度に読み込まないでください。 現在のタスクに関連するものだけを読み込んでください。

モジュールの種類

種類	場所	用途
公開済み	npm パッケージ	@nuxtjs/、nuxt- 形式で配布
ローカル	modules/ ディレクトリ	プロジェクト固有の拡張
インライン	nuxt.config.ts	単純な単発フック

プロジェクト構成

my-module/
├── src/
│   ├── module.ts           # Entry point
│   └── runtime/            # Injected into user's app
│       ├── components/
│       ├── composables/
│       ├── plugins/
│       └── server/
├── playground/             # Dev testing
└── test/fixtures/          # E2E tests

リソース

• モジュールガイド
• Nuxt Kit
• モジュールスターター