デフォルトのバンドラーローダー

デフォルトのバンドラーローダー

デフォルトでは、liferay-npm-bundlerでいくつかの ローダー を使用できます。

  • babel-loaderBabel でソースファイルを処理します。 これにより、バンドラーの前の余分なビルド手順が回避されます。
  • copy-loader :ソースファイル(静的アセット)を出力フォルダにコピーします。
  • css-loader :CSSファイルを、ロードされるとDOMに挿入されるJavaScriptモジュールに変換します。
  • json-loader :JSONファイルのコンテンツをオブジェクトとしてエクスポートするJavaScriptモジュールを生成するため、require()呼び出しでJSONファイルを含めることができます。
  • sass-loader :ソースファイルで node-sass または sass を実行するため、静的CSSファイルを生成できます。 style-loaderの前にチェーンできます。
  • style-loader :CSSファイルをJavaScriptモジュールに変換します。読み込まれると、CSSコンテンツがDOMに挿入されます。 次に、 require()呼び出しでCSSファイルを含めることができます。

liferay-npm-bundlerのローダーの使用例については、 liferay-js-toolkit loaders showcase を参照してください。 デフォルトのローダーが要件を満たさない場合は、 Creating Custom Loaders for Bundler の説明に従って、独自のローダーを作成することができます。