Wie füge ich ein nuxt-Modul aus einem anderen nuxt-Modul hinzu?

Vor kurzem wollte ich ein nuxt-Modul entwickeln, das auf einem bestehenden Modul basiert. Um die Nutzung für den Benutzer so einfach wie möglich zu machen, wollte ich es nicht einfach als Abhängigkeit hinzufügen und den Benutzer auffordern, die Abhängigkeit selbst zusätzlich in der nuxt.config.ts zu registrieren. Mein Ziel war es, dass einfach nur mein Modul installiert und registriert werden muss. Alles, was dessen Abhängigkeiten betrifft, sollte vom Modul selbst erledigt werden. Auf diese Weise müsste sich der Benutzer nicht einmal um das Abhängigkeitsmodul kümmern.

@nuxt/kit als Retter in der Not

In der aktuellen Dokumentation (Stand: Anfang Januar 2023) gibt es kein Beispiel dafür, aber nachdem ich mir ein wenig den nuxt-Code selbst angesehen habe, fand ich schnell eine recht einfache Lösung. Ehrlich gesagt war ich wirklich überrascht, wie einfach sie ist.

Während der Initialisierung von nuxt gibt es eine Schleife über jedes registrierte Modul, in der jedes Modul installiert wird (siehe hier):

for (const m of modulesToInstall) {
    if (Array.isArray(m)) {
        await installModule(m[0], m[1])
    } else {
        await installModule(m, {})
    }
}

Da habe ich mich natürlich gefragt: Woher kommt diese mysteriöse Funktion installModule und was macht sie?
Die Antwort ist einfach, wenn man einen Blick auf die Importe in derselben Datei wirft: sie wird aus @nuxt/kit importiert. Das gleiche Paket, das Funktionen bereitstellt, die auch in Modulen verwendet werden können.

Daraus ergeben sich also folgende Schritte, um ein Modul in einem anderen Modul zu installieren.
Zuerst muss die Abhängigkeit zum neuen Paket in dessen package.json hinzufügt werden, so dass sie automatisch installiert wird, wenn das neue Modulpaket installiert wird.

Danach installiert/registriert man das Abhängigkeitsmodul direkt in der setup-Funktion des neuen Moduls, genau wie man es in der nuxt.config.ts tun würden.

// module.ts
importiere { installModule } von '@nuxt/kit'

export interface ModuleOptions {}

export default defineNuxtModule<ModuleOptions>({
  meta: {
    name: 'ihr-modul-name',
    configKey: 'ihrKonfigSchlüssel',
    compatibility: {
      nuxt: '^3.0.0'
    }
  },
  async setup (options, nuxt) {
    // automatische Installation/Registrierung des Abhängigkeitsmoduls
    await installModule('dependency-module')
  }
})

So können sogar die Optionen des Moduls überschrieben bzw. angepasst werden:

await installModule('dependency-module', {
    optionA: 'new-option-value'
})

Fazit

Ich war wirklich überrascht, als ich entdeckte wie einfach ist, ein Modul über ein anderes Modul zu installieren. Man verwendet einfach die von @nuxt/kit bereitgestellte Funktionalität, die sogar in nuxt selbst verwendet wird, um alle Module zu installieren. Großartige Arbeit des nuxt-Teams! 🥳