HTML izkārtojuma ģenerēšana Webpack

Iepriekšējā nodarbībā mēs instalējām un pievienojām HtmlWebpackPlugin. Tagad, būvējot, mums automātiski tiks ģenerēts HTML izkārtojuma fails un šajā izkārtojumā automātiski tiks pievienotas skriptes un stili.

Izmēģināsim vienkāršāko gadījumu. Pieņemsim, ka mums ir viens ieejas punkts:

webpack.config.jsexport default {
  entry: './src/index.js',
  plugins: [
    new HtmlWebpackPlugin(),
  ],
};

Rezultātā pēc būvēšanas mūsu JavaScript tiks apvienots bundle ar nosaukumu main.js un šis bundle tiks pievienots automātiski izveidotajam vietnes izkārtojumam:

dist/index.html<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Webpack App</title>
    
    <script defer src="main.js"></script>
  </head>
  <body>
    
  </body>
</html>