Utengenezaji wa Mwonekano wa HTML katika Webpack

Katika somo lililopita, tulisakinisha na kuunganisha HtmlWebpackPlugin. Sasa wakati wa kusanya, faili ya mwonekano wa HTML itatengenezwa kiotomatiki na katika mwonekano huu skripti na mitindo itaunganishwa kiotomatiki.

Wacha tujaribu kesi rahisi zaidi. Wacha tuchukue kuwa tuna sehemu moja ya kuingia:

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

Kama matokeo baada ya kusanya, JavaScript yetu itakusanywa katika kifurushi chenye jina main.js na kifurushi hiki kitaunganishwa kwenye mwonekano wa tovuti ulioundwa kiotomatiki:

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

Fanya usakafu ukiwa umewasha HtmlWebpackPlugin. Hakikisha kuwa faili ya mwonekano inaonekana. Chunguza msimbo wake wa asili. Fungua faili kwenye kivinjari.