Bundels van skripte met hash in die uitleg in Webpack
Gewoonlik wanneer ons 'n projek saamstel, wil ons hê dat bundelname 'n hash moet bevat. Dit is nodig om die probleem van blaaier- kasberging van lêers op te los.
Daarom is dit handig dat Webpack outomaties bundels met name wat 'n hash bevat, sal aansluit. Kom ons toets dit. Laat ons die volgende instellings hê:
export default {
context: path.resolve( 'src'),
entry: {
test1: './test1.js',
test2: './test2.js'
},
output: {
filename: '[name].[contenthash].js',
path: path.resolve('dist'),
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Na samestelling sal ons bundels met hashes by die uitleglêer aangekoppel wees:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Webpack App</title>
<script defer src="test1.4173b379c6d6ff439604.js"></script>
<script defer src="test2.72be8754d7c4cb0ece00.js"></script>
</head>
<body>
</body>
</html>
Wanneer projeklêers verander word en die projek weer saamgestel word, sal Webpack outomaties die hashes verander en die veranderinge in die uitleglêer aanbring. As die projeklêers nie verander is nie, sal die hash ook nie verander nie.
Maak drie toetspunte. Maak seker dat hulle in aparte bundels saamgestel word met name wat hashes bevat.
Voer die samestelling van die projek uit. Maak seker dat alle bundels in die uitleglêer aangekoppel is.
Verander die teks in die bronlêer van een van die toetspunte. Voer 'n samestelling uit. Verifieer dat die hash van daardie bundel verander het, maar die van die ander bundels nie.
