Webpack-те HTML үлгінің генерациялауы

Алдыңғы сабақта біз HtmlWebpackPlugin орнатқан және қосқан болатынбыз. Енді жинақтау кезінде бізде HTML үлгі файлы автоматты түрде генерацияланады және осы үлгіге скриптер мен стильдер автоматты түрде қосылады.

Ең қарапайым жағдайды байқап көрейік. Бізде бір кіру нүктесі бар делік:

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

Нәтижесінде, жинақтаудан кейін біздің JavaScript main.js атауымен баңделге жиналады және бұл баңдел сайттың автоматты түрде жасалған үлгісіне қосылады:

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

HtmlWebpackPlugin қосылған күйде жинақтауды орындаңыз. Сізде үлгі файлы пайда болатынын тексеріңіз. Оның бастапқы кодын зерттеңіз. Файлды браузерде ашыңыз.