Url-loader vs File-loader Webpack
Я пытаюсь выяснить разницу между загрузчиком url-loader и файловым загрузчиком. Что означает DataURl
?
Угловой загрузчик работает как файловый загрузчик, но может возвращать DataURL, если файл меньше байтового предела.
Ответы
Ответ 1
url-loader
будет кодировать файлы на base64 и включать их inline, а не загружать их как отдельные файлы с другим запросом.
Файл с кодировкой base64 может выглядеть примерно так:
data:;base64,aW1wb3J0IFJlYWN0IGZ...
Это будет добавлено в ваш комплект.
Ответ 2
Просто хотел добавить к ответу Йенса
file-loader
скопирует файлы в папку сборки и вставит ссылки на них, куда они включены. url-loader
закодирует весь байтовый контент файла как base64 и вставит кодированный base64 контент туда, куда он включен. Так что нет отдельного файла.
Оба они в основном используются для медиаресурсов, таких как изображения. В основном изображения.
Этот метод может ускорить загрузку страницы, поскольку к серверу загружается меньше http-запросов.
Также важно указать ограничение размера для url-loader
. Он автоматически переключится на file-loader
файлов для всех файлов, превышающих этот размер:
{
test: /\.(png|jpg|gif)$/i,
use: [{
loader: 'url-loader',
options: {
limit: 8192 // in bytes
}
}]
}