Использовать файловый загрузчик и html-loader вместе

Question

Я работаю над угловым приложением, которое требует, чтобы файлы html были извлечены в виде простых HTML-файлов и в то же время должны были проверить любые <img src="...">, чтобы потребовать эти изображения (в качестве активов). Кроме того, изображения основаны на корневом пути (так /images/something.png), они должны быть разрешены относительно настройки веб-пакета context (базовый путь).

Как я могу это достичь? Невозможно заставить html-loader хорошо играть с файловым загрузчиком. Поскольку первый выводит JS-файл (с операторами require), а последний ожидает простой HTML-файл.

Answer 1

Я нашел решение самостоятельно, копая много в исходниках кодеков, о которых идет речь.

В принципе, он не работает по умолчанию, потому что файловый загрузчик ожидает «необработанный» файл, поэтому, если вы хотите вывести HTML-файл, вам нужно иметь источник html, а не JS. Однако html-loader принимает HTML-файл и выводит JS-файл (с активами require и содержимым).

Решение было это глубоко скрыто и фантастический extract-loader, который разбирает JS выходит из HTML-загрузчиком, преобразует его обратно в обычный HTML, активы по-прежнему требуется и заменены даже с хэш для очистки кэша.

Это прекрасно, вы передаете результат файловому загрузчику, и у вас наконец есть ваши html-файлы!

Пример конфигурации

В моем случае, моя конфигурация загрузчика выглядит следующим образом:

'file-loader!extract-loader!html-loader' + '?root=' + encodeURIComponent(sourcePath.toString())