Как изменить файл css при помощи node js?

Переменную задай

Windows. Как в VS code изменить "\" на "/" при копировании и вставке относительного пути к файлу?

Андрей, работает, в VS появляется дополнительная строчка меню, но в самом конце.

Как заменить символы в названии нескольких файлов с помощью GULP в одной задаче?

Спасибо, понял)

Как установить Ruby 3.0.0. на подсистему ubuntu 20.04 в Windows?

Роман Мирр , есть ли возможность убрать зависимость с pgadmin4 из списка установки? До сих пор не понял почему он его требует, вроде с постгресом на этой версии не работал, да и в списке установленных пакетов его нет, да и намёков на него.

Как установить Ruby 3.0.0. на подсистему ubuntu 20.04 в Windows?

Да в том то и смысл, что он даже для штатной установки его требует, а ещё и сервер к нему и интерфейс к этому pgadmin4.

Как установить Ruby 3.0.0. на подсистему ubuntu 20.04 в Windows?

Роман Мирр, да, 2.7 такую же ерунду пишет. Зачем мне постгрес ставить никак не пойму) Можно как-нибудь обойтись без этого?

Как скрыть от AddBlock, uBlock и тому подобных сервисов элементы сайта?

Adamos, чуть подшаманил, но всё равно можно кричать — «МАМА!!!», изменил названия классов, но всех не спасло)

Как скрыть от AddBlock, uBlock и тому подобных сервисов элементы сайта?

Я это прекрасно понимаю, что проблемы на моей стороне, речь не о виджетах, а о банальных иконках соцсетей, по типу поделиться или подписаться, другие же без проблем отображаются из созданного иконочного шрифта. Из-за этого теряется часть интерфейса, а соответственно и функционала. На Хабре вон они не блокируются, правда реализация иконок немного другая.

Как скрыть от AddBlock, uBlock и тому подобных сервисов элементы сайта?

Adamos, одно и тоже сообщение на всех заблокированных ресурсах

Failed to load resource: net::ERR_BLOCKED_BY_CLIENT px.js:1

к примеру, конкретики нет, в собственных настройках расширения так же нет полезной информации, что и по какой причине заблокировано.

Как скрыть от AddBlock, uBlock и тому подобных сервисов элементы сайта?

Всё бы хорошо, но если используется иконочный шрифт, как быть в этом случае? Половина иконок отображается корректно, например различные менюшки, поиск, переключатели страниц и так далее, был скомпилирован собственный шрифт, со своими названиями классов) В чём может быть причина блокировки именно социальных сетей и как это исправить не прописывая иконки жёстко?

Как настроить NGINX для прямых трансляций?

Попробуй вот это

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, нужно получить примерно такую структуру

<div style="background-image: url('/images/image.webp')" data-bg="/images/image.jpg" data-bg-webp="/images/image.webp"></div>

но чуть короче)

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, к сожалению он тоже не походит, так как он создан для тега IMG, а мне нужен background-image в инлайновом куске HTML) Чувствую придётся создавать собственный костыль) Логика примерно такая же, как при использовании lazy-load, но чтобы не грузится плейсхолдер и картинка следом, а был выбор между тем, что загружать при поддержке устройством формата WebP)

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, что-то даже и не подумал об этом плагине, а копался в репозиториях npm и различных тематических ресурсах) надо будет посмотреть)

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, я такого не говорил, что нельзя, а наоборот сказал, что можно), но всё это приведёт к появлению дополнительных файлов CSS для каждой страницы в случае использования background-image в CSS, что совсем не нужно. Те примеры, что я привёл выше, показывают примерную структуру которая необходима для натяжки шаблонов страниц на Jekyll. Моя вопрос был в другом, как автоматизировать написание HTML с помощью GULP под использование WebP в теге style со свойством background-image. Пути для посадки на Jekyll в шаблонах, по которым будет генерироваться сайт, для дальнейшей работы будут изменены вручную)

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, к сожалению в Jekyll так нельзя сделать, так как за счёт этих относительных путей как раз и происходит генерация сайта)

Для примера:

<img src="{{ page.linkadd }}pic/tutorials/site/OneMangaDay-site-comipo.png" alt="Website in Comipo" class="imgshad">

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, так в этом и смысл, что шаблон страницы один, а страниц много, если указать в CSS background-image, то придётся генерировать этот CSS для каждой отдельной страницы с путями до нужной картинки, а не использовать один файл CSS для всех основных страниц сайта, поэтому пришлось записывать этот background-image инлайново в HTML, чтобы генерировался только HTML по шаблону с путями до этих картинок)

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, посмотри, что ответил предыдущий комментатор, тот способ, который ты мне предлагаешь с настройками htaccess — мне совершенно не подходит, так же как и тот способ, что предложил предыдущий комментатор.

Попытаюсь объяснить:

Вариант первого комментатора не решает задачу, так как создание и генерация сайта происходит на локальной машине при помощи генератора статичных сайтов Jekyll. Указание свойств background-image в файле CSS, приведёт к тому, что будут сгенерированы множество таких файлов CSS с разными картинками в свойствах для каждой отдельной страницы сайта, что существенно повлияет на загрузку сайта клиентом, он каждый раз будет вынужден скачивать новый файл CSS при переходе между страницами сайта.

Твой вариант также не решает поставленную задачу, так как простой переадресацией не обойтись, а HTML переписывать для 1000 страниц в ручную с указанием различных атрибутов и тегов — такое себе занятие)

Почему я не могу использовать простые HTML-теги IMG вместо CSS-свойства BACKGROUND-IMAGE прописанного в HTML-теге STYLE. Я этого сделать не могу, так как интерфейс накладывающийся на фоновую картинку имеет несколько интерактивных слоёв, ссылки и кнопки. Мог бы конечно использовать IMG и прописать дополнительные строки кода каждой картинки в дизайне для создания шаблона для посадки на CMS, но в этом дизайне их на странице доходит до 50 штук, ты можешь сам себе представить сколько дополнительных килобайт прибавится к каждой странице)

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, кусочек кода моей сборки)

imagemin = require('gulp-imagemin');
webp = require('gulp-webp');
webphtml = require('gulp-webp-html');
webpcss = require('gulp-webpcss');

Эти плагины прекрасно обрабатывают CSS, картинки, теги в HTML IMG, но они не способны обработать вот эту строчку кода:

<div class="example" style="background-image: url(img/example.jpg);"></div>

Вот в этом и заключается моя проблема, которую я пытаюсь решить

Как автоматизировать преобразование фоновых изображений, заключённых в теге в HTML с помощью GULP в формат WebP и самого HTML?

Антон Шаманов, это какой?, если не секрет, я весь Гугл перерыл) Чувствую придётся создавать собственный плагин) Такие плагины есть для тега IMG в файле HTML или для файла CSS и свойства, background-image, но для HTML и инлайнозаписанного свойства background-image к сожалению нет) Нужны костыли, пока не нашёл адекватного решения. Ладно бы, что это нужно было для одного десятка страниц, можно и в ручную прописать, но планируется обработать более 1000 страниц данным методом.