ওয়েবপ্যাকে অ্যাসেট ফাইলের পথ কাস্টমাইজেশন

বিল্ড ফোল্ডারে অ্যাসেট ফাইলগুলির পথ নির্দিষ্ট করা যেতে পারে এটি assetModuleFilename সেটিং ব্যবহার করে করা হয় এই সেটিংয়ে আমরা ফোল্ডারটি নির্দিষ্ট করতে পারি, যেখানে অ্যাসেটগুলি রাখা হবে, এবং সেইসাথে ফাইলের নামের টেমপ্লেট

নামের টেমপ্লেটে [name] কমান্ড ফাইলের নাম নির্দেশ করে, [hash] কমান্ড - হ্যাশ, এবং [ext] কমান্ড - মূল ফাইলের এক্সটেনশন

সুতরাং, আসুন কনফিগারেশন সম্পন্ন করি:

export default {
	entry: './src/index.js',
	output: {
		filename: 'bundle.js',
		path: path.resolve('dist'),
		assetModuleFilename: 'assets/[name].[hash][ext]', // আমাদের সেটিং
	},
	module: {
		rules: [
			{
				test: /\.png$/,
				type: 'asset/resource'
			}
		]
	},
	plugins: [
		new HtmlWebpackPlugin(),
	],
};

নিশ্চিত করুন যে সমস্ত অ্যাসেট resources ফোল্ডারে জমা হয়