Webpack'te HTML Şablonu Oluşturma
Önceki derste, HtmlWebpackPlugin'i kurduk ve yapılandırdık. Artık derleme sırasında bir HTML şablon dosyası otomatik olarak oluşturulacak ve bu şablona betikler ve stiller otomatik olarak eklenecek.
En basit durumu deneyelim. Bir tane giriş noktamız olduğunu varsayalım:
export default {
entry: './src/index.js',
plugins: [
new HtmlWebpackPlugin(),
],
};
Sonuç olarak, derlemeden sonra JavaScript'imiz
main.js adında bir pakete (bundle) dönüşecek
ve bu paket otomatik olarak oluşturulan
site şablonuna eklenecek:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Webpack App</title>
<script defer src="main.js"></script>
</head>
<body>
</body>
</html>
HtmlWebpackPlugin etkinken bir derleme yapın. Şablon dosyasının oluştuğunu kontrol edin. Kaynak kodunu inceleyin. Dosyayı bir tarayıcıda açın.
