Personalização do caminho de arquivos de asset no Webpack
É possível definir o caminho para os arquivos de assets
na pasta de build. Isso é feito
usando a configuração assetModuleFilename.
Nesta configuração, podemos especificar a pasta
onde os assets serão colocados, bem como o template
do nome do arquivo.
No template de nome, o comando [name]
representa o nome do arquivo, o comando [hash] - o hash,
e o comando [ext] - a extensão
do arquivo original.
Então, vamos fazer a configuração:
export default {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve('dist'),
assetModuleFilename: 'assets/[name].[hash][ext]', // nossa configuração
},
module: {
rules: [
{
test: /\.png$/,
type: 'asset/resource'
}
]
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Faça com que todos os assets
sejam colocados na pasta resources.
