В чем разница между загрузчиком и плагином в Webpack?

Question

Загрузчики преобразуют файлы (например, TypeScript в JavaScript или SCSS в CSS), чтобы Webpack мог их обработать. Плагины, напротив, работают на более высоком уровне — они добавляют функциональность в процесс сборки, например, оптимизацию или создание новых файлов.

YeaHub · Accepted Answer

Основное различие между загрузчиками и плагинами в том, что они выполняют разные задачи:Загрузчики:Загрузчики занимаются преобразованием отдельных файлов. Они применяются на этапе обработки файлов, используя цепочки трансформации. Например, чтобы преобразовать SCSS в CSS:module: {
  	rules: [
    	{
      		test: /\.scss$/,
      		use: ['style-loader', 'css-loader', 'sass-loader'],
    	},
  	],
}Плагины:Плагины добавляют функциональность на этапе сборки. Они выполняют сложные задачи, такие как минификация кода, автоматическое подключение скриптов или кэширование. Например, TerserPlugin минифицирует JavaScript:const TerserPlugin = require('terser-webpack-plugin');

module.exports = {
  	optimization: {
    	minimize: true,
    	minimizer: [new TerserPlugin()],
  	},
};Таким образом, загрузчики обрабатывают контент, а плагины изменяют сам процесс сборки. Оба инструмента работают совместно, чтобы создавать готовый продукт.