Aanpassen van het pad naar assetbestanden in Webpack
Je kunt het pad naar de assetbestanden
in de buildmap instellen. Dit wordt gedaan
met behulp van de instelling assetModuleFilename.
In deze instelling kunnen we de map specificeren,
waar de assets worden geplaatst, evenals de sjabloon
voor de bestandsnaam.
In de naam sjabloon geeft het commando [name]
de bestandsnaam aan, commando [hash] - de hash,
en commando [ext] - de extensie
van het oorspronkelijke bestand.
Laten we dus de configuratie uitvoeren:
export default {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve('dist'),
assetModuleFilename: 'assets/[name].[hash][ext]', // onze instelling
},
module: {
rules: [
{
test: /\.png$/,
type: 'asset/resource'
}
]
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Zorg ervoor dat alle assets
in de map resources worden geplaatst.