වෙබ්පැක් වල හැෂ් සහිත ස්ක්රිප්ට් බන්ඩල්
සාමාන්යයෙන් ව්යාපෘතිය එකතු කිරීමේදී අපිට අවශ්ය වන්නේ බන්ඩල්වල නම්වල හැෂ් අඩංගු වීමයි. බ්රවුසරය මගින් ගොනු කෑෂ් කිරීමේ ප්රශ්නය විසඳීම සඳහා අපට මෙය අවශ්ය වේ.
එමනිසා, වෙබ්පැක් ස්වයංක්රීයව හැෂ් අඩංගු නම් සහිත බන්ඩල් හඳුන්වා දෙන බව පහසුය. අපි පරීක්ෂා කරමු. පහත සැකසුම් අප සතුව ඇතැයි සිතමු:
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(),
],
};
එකතු කිරීමෙන් පසු, ගොනු සැකිල්ලට අපගේ හැෂ් සහිත බන්ඩල් අනුබද්ධ වේ:
<!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>
මෙම අවස්ථාවේදී, ව්යාපෘති ගොනු වෙනස් කිරීමේදී හා නැවත එකතු කිරීමේදී වෙබ්පැක් ස්වයංක්රීයව හැෂ් වෙනස් කර සැකිලි ගොනුවේ වෙනස්කම් සිදු කරයි. ව්යාපෘති ගොනු වෙනස් නොවුනේ නම්, හැෂ් ද වෙනස් නොවේ.
ඇතුලත් වීමේ ලකුණු තුනක් සාදන්න. ඒවා හැෂ් අඩංගු නම් සහිත වෙනම බන්ඩල් වලට එකතු වන ලෙස සකසන්න.
ව්යාපෘතිය එකතු කරන්න. සැකිලි ගොනුවේ සියලුම බන්ඩල් අනුබද්ධ වී ඇති බවට විශ්වාස ඇති කර ගන්න.
ඇතුලත් වීමේ එක් ලක්ෂ්යයක මූලාශ්ර ගොනුවේ පෙළ වෙනස් කරන්න. එකතු කිරීම සිදු කරන්න. එම ලක්ෂ්යයේ බන්ඩල් හැෂ් වෙනස් වන අතර අනෙක් බන්ඩල්වල හැෂ් වෙනස් නොවන බව පරීක්ෂා කරන්න.
