Mehrere Script-Bundles im Layout in Webpack
Wenn als Ergebnis des Builds mehrere Bundles entstehen, wird Webpack jedes einzelne davon einbinden. Lassen Sie uns das überprüfen. Nehmen wir an, wir haben die folgenden Einstellungen:
export default {
context: path.resolve( 'src'),
entry: {
test1: './test1.js',
test2: './test2.js'
},
output: {
filename: '[name].build.js',
path: path.resolve('dist'),
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Nach dem Build werden beide unserer Bundles in die Layout-Datei eingebunden:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Webpack App</title>
<script defer src="test1.build.js"></script>
<script defer src="test2.build.js"></script>
</head>
<body>
</body>
</html>
Erstellen Sie drei Einstiegspunkte. Führen Sie den Build durch. Untersuchen Sie die Layout-Datei und vergewissern Sie sich, dass alle Ihre Bundles dort eingebunden sind.