modules プロパティ
モジュールは Nuxt のコア機能を拡張し、無限のインテグレーションを加える Nuxt の拡張機能です。詳細はこちら
-
型:
Array
例 (nuxt.config.js
):
export default {
modules: [
// パッケージ名を使う
'@nuxtjs/axios',
// プロジェクトの srcDir からの相対パス
'~/modules/awesome.js',
// オプションを渡す
['@nuxtjs/google-analytics', { ua: 'X1234567' }],
// インラインで定義
function () {}
]
}
モジュール開発者は通常、追加で必要なステップや使用方法の詳細を提供します。
Nuxt は node の読み込みパス(node_modules
の中)を用いてモジュール配列内の各要素を解決しようとします。~
エイリアスが使用されている場合、プロジェクトの srcDir
から解決されます。モジュールは順番に実行されるため、順序が重要です。
注意: モジュールによって注入されたプラグインは、プラグインリストの 先頭 に追加されます。オプションとして:
-
自分のプラグインをプラグインリストの最後に手動で追加します(
this.nuxt.options.plugins.push(...
) - 他のモジュールに依存している場合、モジュールの順序を逆にします
モジュールは nuxt のビルド/ランタイムを強化する機能をエクスポートし、必要に応じてそれらのジョブが完了するまで promise を返却する必要があります。実行時に必要とされるので、最新の ES6 機能に依存する場合には、すでにトランスパイルされている必要があることに注意して下さい。
モジュールの仕組みや独自のモジュール開発に興味がある場合、より詳細な情報についてはモジュールガイド を参照して下さい。また、公式のモジュール セクションでは Nuxt Community によって作られた数多くの本番用モジュールの一覧を提供しています。
buildModules
一部のモジュールは開発時およびビルド時にのみ必要になります。buildModules
を使うことで本番環境の起動を速くし、本番環境にデプロイされる node_modules
のサイズを大幅に減らすことができます。それぞれのモジュールのドキュメントを参照して、modules
と buildModules
どちらを使うのが推奨されているかを確認してください。
使用方法の違いは以下のとおりです:
-
nuxt.config.js
にmodules
を追加するかわりにbuildModules
を使います -
package.json
にdependencies
を追加するかわりにdevDependencies
を使います(yarn add --dev
またはnpm install --save-dev
)