Gulp-webp-in-html, как отключить для svg-изображений?

Question

[IronPants]

Есть ли способ (идея) как добавить в исключения для плагина gulp-webp-in-html теги img, в которых есть src на svg-картинки?

Вот, что происходит сейчас:

src:

<img class="social__img" src="assets/img/pinterest.svg" alt=Pinterest">

dist:

<picture>
    <source srcset="assets/img/pinterest.svg" type="image/webp">
    <img class="social__img" src="assets/img/pinterest.svg" alt="Pinterest">
</picture>

Comments

[Dmitriy-Dev]

Здравствуйте, с такой же проблемой столкнулся. Вы нашли решения?

Answer 1

[lamer350]

Идея:
исправить условие в модуле, судя по гитхабу там нет проверки по типу файла, думаю там где проверяется вообще url в модуле сразу и проверить тип файла

Comments

[IronPants]

Да, тоже об этом думал, но регулярки еще не изучал, видимо, теперь пригодится...

[lamer350]

IronPants, да там в принципе регулярка и не нужна...
я прикинул примерно, должно по идее работать, попробуйте - отпишитесь

module.exports = function () {
  var extensions = ['.jpg', '.png', '.jpeg', '.JPG', '.PNG', '.JPEG'];
  return through.obj(function (file, enc, cb) {
  	var fileExt = file.split('.').slice(-1); //разбиваем имя файла на массив и получаем последний елемент (тип файла)
  	    fileExt = fileExt.trim(); //очищаем на всякий случай пробелы
    if (file.isNull() && extensions.indexOf( fileExt ) == -1) {
      cb(null, file);
      return;
    }

    ........ тут код далее ........

[lamer350]

IronPants, там ошибочка была в условии, вместо != надо было наоборот ==, если уже пробовали чтобы пересмотрели код, если нет - то я уже в сообщении исправил

[IronPants]

Попробовал, выводит split is not a function
Дело в том, что file - это не адрес картинки, это объект с св-вом contents, которое содержит html, в котором есть разметка с картинкой.

Answer 2

[ivanSenior]

npm i webpHtmlNosvg --save-dev Плагин который исключает svg

Answer 3

[Александр Серый]

gulp-webp-html-nosvg