Ассетҳои умумӣ дар Webpack

Акнун биёед ассетҳои умумӣро санҷем. Биёед тавре созем, ки тасвирҳое, ки хурдтар аз 8kb ҳастанд, ба base64 табдил дода шаванд, ва тасвирҳои калонтар аз ин андоза ба файл нусхабардорӣ карда шаванд:

export default {
	entry: './src/index.js',
	output: {
		filename: 'bundle.js',
		path: path.resolve('dist'),
	},
	module: {
		rules: [
			{
				test: /\.png$/,
				type: 'asset',
			}
		]
	},
	plugins: [
		new HtmlWebpackPlugin(),
	],
};

Метеван маҳдудияти андозаи тасвирро тағир диҳед. Барои мисол, маҳдудияти 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(),
	],
};

Ба нуқтаи вуруди худ чанд тасвири андозаҳои гуногунро пайваст кунед. Санҷед, ки барои ҳар як тасвир кадом навъи табдилҳо татбиқ карда мешавад.