Webpackда HTML макет генерацияси

Олдинги дарсда биз HtmlWebpackPlugin-ни ўрнатиб, улладик. Энди бизда қуриш жараёнида автоматик равишда HTML макет файли генерация бўлади ва ушбу макетга скриптлар ва стиллар автоматик уланган бўлади.

Келгила, энг содда ҳолатни синаб кўрамиз. Бизда битта кириш нуқтаси бор деб фараз қилайлик:

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

Натижада, бизнинг JavaScript main.js номи билан бандлга тўпланади ва ушбу бандл автоматик яратилган веб-сайт макетига уланади:

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

HtmlWebpackPlugin йўни билан қуришни бажаринг. Сизда макет файли пайдо бўлишини текширинг. Унинг бошаңғоқ кодини ўрганинг. Файлни браузерда oching.