Assets Umum di Webpack
Sekarang mari kita coba assets umum.
Mari kita buat agar gambar kurang dari 8kb
diubah menjadi base64, dan gambar yang lebih besar
dari ukuran ini disalin ke file:
export default {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve('dist'),
},
module: {
rules: [
{
test: /\.png$/,
type: 'asset',
}
]
},
plugins: [
new HtmlWebpackPlugin(),
],
};
Batas ukuran gambar dapat diubah.
Sebagai contoh, mari terapkan batas
sebesar 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(),
],
};
Sambungkan beberapa gambar dengan ukuran berbeda ke entry point. Periksa jenis transformasi mana yang diterapkan untuk setiap gambar.
