Assets generale în Webpack
Să încercăm acum assets generale.
Să facem astfel încât imaginile mai mici de 8kb
să se transforme în base64, iar imaginile mai mari
de această dimensiune să fie copiate într-un fișier:
export default {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve('dist'),
},
module: {
rules: [
{
test: /\.png$/,
type: 'asset',
}
]
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Se poate modifica limita pentru dimensiunea
imaginii. De exemplu, să impunem o limită
de 4kb:
export default {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve('dist'),
},
module: {
rules: [
{
test: /\.png$/,
type: 'asset',
parser: {
dataUrlCondition: {
maxSize: 4 * 1024 // 4kb
}
}
}
]
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Conectați la punctul de intrare mai multe imagini de dimensiuni diferite. Verificați, ce tip de transformări se aplică pentru fiecare imagine.
