Файли макети фардии дар Webpack

Амалан, одатан мо аллакай макети HTML-и худро дорем. Дар ин ҳолат, ба мо лозим аст, ки Webpack макети моро гирад, на ин ки макети худро ҳосил кунад. Биёед бубинем, ки ин чӣ гуна анҷом дода мешавад.

Фарз мекунем, ки мо макети зеринро дорем:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Макети ман</title>
	</head>
	<body>
		
	</body>
</html>

Ба Webpack маҷбур мекунем, ки макети моро гирад. Барои ин, онро дар танзимоти зерин менависем:

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

Дар натиҷа, пас аз сохт, дар ҷузвдон dist макети мо ҳаст ва дар он ба таври худкор ҳамаи бандлҳо пайваст карда мешаванд:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Макети ман</title>
		
		<script defer src="main.js"></script>
	</head>
	<body>
		
	</body>
</html>

Макети худро созед. Webpack-ро чунон танзим кунед, ки макети шуморо гирад.