Generering van HTML-uitleg in Webpack

In die vorige les het ons HtmlWebpackPlugin geïnstalleer en gekoppel. Nou sal daar outomaties 'n HTML-uitleg lêer tydens die bouproses gegenereer word en in hierdie uitleg sal skripte en style outomaties gekoppel wees.

Kom ons probeer die eenvoudigste geval. Laat ons aanneem ons het een ingangspunt:

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

As gevolg hiervan, na die bouproses, sal ons JavaScript in 'n bondel met die naam main.js saamgestel word en hierdie bondel sal aan die outomaties geskepte webwerf-uitleg gekoppel word:

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>
Задание 1

Voer die bouproses uit met HtmlWebpackPlugin aangeskakel. Verifieer dat die uitleg lêer by jou verskyn. Bestudeer die bronkode daarvan. Maak die lêer in 'n blaaier oop.