Tu propio archivo de diseño en Webpack
En la práctica, normalmente ya tenemos nuestro propio diseño HTML del sitio. En este caso necesitamos que Webpack tome nuestro diseño, y no genere el suyo. Veamos cómo se hace.
Supongamos que tenemos el siguiente diseño:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My layout</title>
</head>
<body>
</body>
</html>
Hagamos que Webpack tome nuestro diseño. Para ello, lo especificamos en la siguiente configuración:
export default {
entry: './src/index.js',
plugins: [
new HtmlWebpackPlugin({
template: './src/index.html',
}),
],
};
Como resultado, después de la compilación en la carpeta
dist estará nuestro diseño y en él
se conectarán automáticamente
todos los bundles:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My layout</title>
<script defer src="main.js"></script>
</head>
<body>
</body>
</html>
Crea tu propio diseño. Configura Webpack para que tome tu diseño.
