Personnalisation du chemin des fichiers assets dans Webpack
Il est possible de définir le chemin des fichiers assets
dans le dossier de build. Cela se fait
via le paramètre assetModuleFilename.
Dans ce paramètre, nous pouvons spécifier le dossier
où les assets sont déposés, ainsi que le modèle
du nom de fichier.
Dans le modèle de nom, la commande [name]
désigne le nom du fichier, la commande [hash] - le hash,
et la commande [ext] - l'extension
du fichier initial.
Alors, procédons à la configuration :
export default {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve('dist'),
assetModuleFilename: 'assets/[name].[hash][ext]', // notre paramètre
},
module: {
rules: [
{
test: /\.png$/,
type: 'asset/resource'
}
]
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Faites en sorte que tous les assets
soient déposés dans le dossier resources.
