Nuxt 3 Release Candidate is out! Discover more about it on v3.nuxtjs.org

Page traduite Le contenu de cette page peut être déprécié.

Conteneur de module

Conteneur de module Nuxt


Tous les modules seront appelés dans le contexte de l'instance ModuleContainer.

Plugins à usage unique

Nous pouvons enregistrer des hooks sur certains événements du cycle de vie.

nuxt.moduleContainer.plugin('ready', async moduleContainer => {
  // Faites-le après que tous les modules soient prêts
})

Dans le contexte des modules , nous pouvons utiliser cette méthode à la place :

this.plugin('ready', async moduleContainer => {
  // Faites-le après que tous les modules soient prêts
})
Plugin Arguments Quand
ready moduleContainer Tous les modules dans nuxt.config.js ont été initialisés

Méthodes

addVendor (vendor)

Déprécié car le terme vendor n'est plus utilisé

Ajoute à options.build.vendor et applique un filtre unique.

addTemplate (template)

  • template: String or Object
    • src
    • options
    • fileName

Affiche le modèle en utilisant lodash template pendant l'intégration au projet buildDir (.nuxt).

Si fileName n'est pas fourni ou si template est une chaîne de caractères, le nom du fichier cible est par défaut [dirName].[fileName].[pathHash].[ext].

Cette méthode renvoie l'objet final { dst, src, options }.

addPlugin (template)

  • template: Object à propriétés (src, options, fileName, mode).

Enregistre un plugin en utilisant addTemplate et l'ajoute à la première ligne des options plugins[].

Vous pouvez utiliser template.ssr : false pour désactiver le plugin y compris dans le bundle SSR.

this.addPlugin({
  src: path.resolve(__dirname, 'templates/foo.js'),
  fileName: 'foo.server.js' // [optionnel] inclus seulement dans un serveur bundle
  options: moduleOptions
})

Note: Vous pouvez utiliser mode ou .client et .server modificateur avec fileName option pour utiliser le plugin uniquement côté client ou côté serveur. (Voir plugins pour toutes les options valides)

Si vous choisissez de spécifier un fileName, vous pouvez également configurer un chemin personnalisé pour le fileName, afin que vous puissiez choisir la structure des dossiers dans le dossier .nuxt afin d'éviter les conflits de noms :

{
  fileName: path.join('folder', 'foo.client.js'), // will result in `.nuxt/folder/foo.client.js`
}

addServerMiddleware (middleware)

Pousse le middleware dans options.serverMiddleware .

extendBuild (fn)

Permet d'étendre facilement la configuration du webpack par chaînage dans la fonction options.build.extend .

extendRoutes (fn)

Permet d'étendre facilement les routes dans la fonction options.build.extendRoutes .

addModule (moduleOpts, requireOnce)

Async function

Enregistre un module. Les moduleOpts peuvent être une chaîne de caractères ou un tableau ([src, options]). Si requireOnce est true et que le module est résolu dans les meta, cela empêchera d'enregistrer deux fois le même module.

requireModule (moduleOpts)

Async function

Est un raccourci pour addModule(moduleOpts, true)

Hooks

Nous pouvons enregistrer des hooks sur certains événements du cycle de vie.

Hook Arguments Quand
modules:before (moduleContainer, options) Appelé avant la création de la classe ModuleContainer, utile pour surcharger les méthodes et les options.
modules:done (moduleContainer) Appelé lorsque tous les modules ont été chargés.
Editer cette page sur GitHub Mise à jour le mar. 16 août 2022