スクラッチwebpack4.x（3）HTMLプラグイン

HTML-のWebPACK - プラグイン

このプラグインは、2つの主要な機能を持っています

外部リソースへ1. htmlファイルは、そのようなスクリプトの導入として、リンクが動的に各ハッシュ・コンパイル後に追加され、外部のキャッシュファイル参照問題を防ぎます

2.入口はNのhtml-のWebPACK - プラグインの設定は、Nページを生成することができ、このような単一のHTMLページとして、HTMLファイル、ファイルエントリを生成することを作成するために生成することができる入口

= HtmlWebpackPlugin LET（必要' HTML-WebPACKの-プラグイン' ）; 

プラグイン：[ 
        新しい新しい HtmlWebpackPlugin（{   // 出力HTMLファイル 
            テンプレート：' ./src/index.html '、          // ファイルパスHTMLテンプレート 
            ファイル名：「インデックス.htmlを"、                // 出力ファイル名 
            縮小化：{                              // 圧縮 
                removeAttributeQuotes：trueに、       // 削除"" 
                collapseWhitespace：trueに          //は空白を取り除き
            }、
            ハッシュ：trueに  // 各パッケージは、異なるタイムスタンプのハッシュを有する
        }）、
         新しい新しいMiniCssExtractPlugin（{ 
            名：' あるmain.css ' 
        }）
    ]

いくつかの一般的な縮小化の構成：

プラグイン：[
         新しい新HtmlWebpackPlugin（{
 //は一部省略し、特定の構成は、縮小化を参照
縮小化：{
      // falseにするかどうか、大文字と小文字を区別し、デフォルト 
    CASESENSITIVE：trueに、
    
    // か省略形式ブール属性：無効=「無効」速記デフォルトはfalseで無効になっています 
    ：collapseBooleanAttributes trueに、
    
    // 、デフォルトはfalseスペースを削除するかどうか 
    ：collapseWhitespaceをtrueに、
    
    // （圧縮を行っクリーンCSSを使用して）HTMLのCSSで圧縮するかどうかのデフォルト値はfalse; 
    minifyCSS：trueに、
    
    // かどうかを圧縮HTMLにレーンJS（uglify-JS圧縮を使用して行わ） 
    minifyJS：trueに、
    
    // 防ぎ値の属性のエスケープ
    preventAttributesEscaping：trueに、
    
    // デフォルト属性を削除するかどうか偽引用 
    removeAttributeQuotesを：trueに、
    
    // コメントはデフォルトはfalse削除するかどうか 
    ：removeCommentsをtrueに、
    
    // スクリプトやスタイルからの虚偽のコメントをデフォルト削除 
    removeCommentsFromCDATAを：trueに、
    
    // 空削除するかどうか属性は、デフォルトはfalse 
    removeEmptyAttributesを：trueに、
    
    //   これは、HTML、オン一切体と頭を発生していない場合、HTMLはない、閉じてい 
    removeOptionalTags：偽を、
    
    // 追加のプロパティを削除 
    removeRedundantAttributesを：trueに、
    
    //プロパティの種類の削除スクリプトは、次のスクリプトのデフォルト値の型H5：テキスト/ javascriptのデフォルト値はfalse 
    removeScriptTypeAttributesは：trueに、
    
    // プロパティ、タイプ=「テキスト/ cssの」同上の種類のスタイルを削除 
    removeStyleLinkTypeAttributesを：trueに、
    
    // 使用して短いですドキュメントタイプ、デフォルトはfalse 
    useShortDoctype：trueに、
    } 
    }）、
]

その他のプロジェクトは、詳細な追従性になります

スクラッチwebpack4.x（3）HTMLプラグイン

HTML-のWebPACK - プラグイン

おすすめ