HTMLテンプレートプラグインのWebPACK HtmlWebpackPluginのhtml-WebPACKの-プラグイン

前書き:

HtmlWebpackPlugin HTMLの簡素化の作成は、あなたのWebPACKのバンドルを提供するファイル。これは、すべてのコンパイルを変更するファイル名にハッシュを含めるWebPACKのバンドルに特に便利です。あなたはどちらか、プラグインがあなたのためのHTMLファイルを生成してみましょう使用して独自のテンプレートを供給することができ  lodashテンプレートを、またはあなた自身の使用  ローダーを

翻訳:HtmlWebpackPlugin簡素化HTMLの作成は、あなたのWebPACKパッケージサービス用のファイル。これは、すべてのコンパイルを変更し、パッケージのために特に便利ですファイル名でのWebPACKのハッシュが含まれています。あなたはプラグインテンプレートは、独自のテンプレートをlodash提供したり、独自のローダを使用して使用して、HTMLファイルを生成させることができます。

会場の権限を説明してください:  https://webpack.js.org/plugins/html-webpack-plugin/   または   https://github.com/jantimon/html-webpack-plugin

インストール:

NPM --save-devのHTML-のWebPACK  - プラグインやNPM I -Dのhtml-WebPACKの-プラグインをインストール

使用法:

constのHtmlWebpackPlugin =必要( 'HTML-webpack- プラグイン')

module.exportsは = {
  エントリ:「index.js」
  出力:{
    ファイル名:「index_bundle.js」
    パス:__dirname + '/ distの'
  }、
  プラグイン:[新しいHtmlWebpackPlugin()]
}

このプラグインは、多くの設定可能なパラメータがあります。

プラグイン:[
   新しいHtmlWebpackPlugin({
    タイトル:「出力管理」
    ファイル名:「インデックス-bundle.html」     / * ---- ---ファイルの最終的な名前を生成するように構成することができます* / 
    テンプレート:「./src/index.html」       / * ----初期テンプレートを設定することができます- - * /
  })
]、

その他のコンフィギュレーション・会場:https://github.com/jantimon/html-webpack-plugin#options

  

おすすめ

転載: www.cnblogs.com/ladybug7/p/12324877.html