Порекомендуйте ресайзер изображений и генератор HTML-разметки?

Есть картинка image.jpg достаточно большим размером 4000*5000 px, конфиг необходимых размеров по breakpoint'ам {1200: 900px, 768: 700px, 1: 500px} и конфиг dpr {1, 2, 3}.
Необходимо получить пачку картинок по указанным размерам:
image-900@1.jpg
image-700@1.jpg
image-500@1.jpg
image-900@2.jpg
image-700@2.jpg
image-500@2.jpg
image-900@3.jpg
image-700@3.jpg
image-500@3.jpg
и HTML-разметку (просто выводом в консоль)
<picture>
 <source media="(min-width: 1200px)" srcset="image-900@1.jpg 1x, image-900@2.jpg 2x, image-900@3.jpg 3x">
 <source media="(min-width: 768px)" srcset="image-700@.jpg 1x, image-700@2.jpg 2x, image-700@3.jpg 3x">
 <img srcset="image-500@1.jpg 1x, image-500@2.jpg 2x, image-500@3.jpg 3x">
</picture>
Подобная задача легко решается в CMS, но изредко нужно "ручное", консольное решение, предпочтительно на node.js.

В интернетах находятся интересные варианты https://github.com/felixrieseberg/responsive-image... https://github.com/TrigenSoftware/gulp-srcset, https://github.com/mahnunchik/gulp-responsive только для ресайза, но хочется комплексного решения для максимальной автоматизации и без велосипедостроения.
Порекомендуйте, если встречали что-то подобное?
  • Вопрос задан
  • 314 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы