翻訳されたページ このページのコンテンツは古い可能性があります。
原文を読む このページの翻訳を改善する

Nuxt モジュールの紹介

Nuxt 内部の理解を深める

Nuxt は完全にモジュール化されたアーキテクチャを備えているため、開発者は柔軟な API を使用して Nuxt Core の任意の部分を拡張できます。

独自のモジュール開発に興味がある場合はモジュールガイド のドキュメントを参照してください。

このセクションは Nuxt 内部に詳しくなるために役立ち、独自のモジュールを作成する際に Nuxt 内部をよりよく理解するためのリファレンスとして使えます。

コア

これらのクラスは Nuxt の心臓部であり、実行時とビルド時の両方に存在する必要があります。

Nuxt

Renderer

ModuleContainer

Build

これらのクラスは、ビルドモードまたは開発モードでのみ必要です。

Builder

Generator

共通

Utils

Options

パッケージング＆使用方法

Nuxt はデフォルトですべてのクラスをエクスポートします。それらをインポートするには：

import { Nuxt, Builder, Utils } from 'nuxt'

共通のパターン

すべての Nuxt クラスには nuxt インスタンスとオプションへの参照を持ちます。そのため options と nuxt にアクセスするためのクラス間で一貫した API を常に持ちます。

class SomeClass {
  constructor(nuxt) {
    super()
    this.nuxt = nuxt
    this.options = nuxt.options
  }

  someFunction() {
    // `this.nuxt` と `this.options` へアクセスできます
  }
}

クラスは プラガブル なのでより多くのフックを登録するには nuxt コンテナにプラグインを登録する必要があります。

class FooClass {
  constructor(nuxt) {
    super()
    this.nuxt = nuxt
    this.options = nuxt.options

    this.nuxt.callHook('foo', this)
  }
}

以下のように foo モジュールにフックできます：

nuxt.hook('foo', foo => {
  // ...
})