• Блог
  • [MinifyX] Обновление библиотек

Основной причиной выпуска данной версии стало исправление бага с calc() в библиотеке обработки css (жаль что до vmin и vmax у них руки не дошли). А так как многие жаловались на это, я решил не откладывать обновление в долгий ящик и сделать приятное к празднику. Собирать пакет только ради одного багфикса не хотелось, поэтому я добавил ещё пару фич —

  • Минификация контекста.
  • Использование версии для скриптов и стилей, чтобы обойти кэш браузера.
  • Функция minify() для работы в php коде.

Первая фича включается соответствующей системной настройкой. Честно говоря, не знаю, зачем это нужно, но в сообществе с определённой периодичностью встаёт данный вопрос. Вот теперь такая возможность есть.

Вторая фича пригодится в том случае, если скомпилированный файл имеет постоянное имя. Как вы понимаете, для файла с хешем в имени кэш браузера не страшен. Как это работает? У сниппета нужно указать параметр «version», в который передать соответствующее значение. Например,


В результате получится такой код:

<link rel="stylesheet" href="/assets/components/minifyx/cache/styles.css?v=1.2.3">

Кроме того, если указать значение «auto», то версия будет генериться автоматически в виде 6-тизначного хеша.

Про функцию minify() чуть подробнее. Она предназначена, в первую очередь, для работы с файлами стилей и скриптов в коде php. Например, в консоли в админке. Т.е. собрать и минифицировать файлы можно вручную не нагружая пользователя. Как это работает? Берём modalConsole и кодим.

// Выводим относительный путь к файлу
echo minify([
    'cssSources' => 'url/to/css/file1.css,url/to/css/file2.css',
    'minifyCss' => true,
    'minifyJs' => true,
    'hooks' => 'fixVm.php',
    'cssFilename' => 'styles.min.css',
    ]);

В функцию передаётся массив параметров как при вызове сниппета. Но есть ещё вариант — параметры передавать в качестве методов в цепочке.

// Выводим относительный путь к файлу
echo minify([
    'cssSources' => 'url/to/css/file1.css,url/to/css/file2.css',
    ])
    ->minify()  // выставляет параметры минификации css и js
    ->cacheFolder('/assets/css/')  // переназначает папку хранения скомпилированных файлов
    ->hooks('fixVm.php')  // исправляем проблему с vmin и vmax
    ->cssFilename('styles.min.css')
    ->run();

Обратите внимание, что если вы выводите функцию через echo или print, то результат магически приводится к строке. Если же нужно присвоить результат в переменную, то заканчивать цепочку надо методом run(). Лучше всегда использовать последний вариант и принудительно запускать обработку.

И ещё вместо двух параметров «minifyCss» и «minifyJs» можно использовать один метод minify().

Метод cacheFolder позволяет указать папку, в которую будут помещены скомпилированные файлы. Если не указать, то они будут помещены в папку, указанную в системной настройке «minifyx_cacheFolder».

Ну и вставляем ссылку на указанный файл в шаблоне (только один раз естественно)

<link rel="stylesheet" href="/assets/css/styles.min.css">

Получается такой своеобразный php-шный webpack. Думаю, такой альтернативный вариант использования MinifyX не будет лишним. Пригодится, например, собирать sass и less файлы.

С Новым годом!

Друзья! От всей души поздравляю всех вас с наступающим Новым годом! Хочу пожелать всем счастья, удачи, успехов на всех фронтах и благополучия! До встречи в Новом году!

1   3976

Комментарии ()

  1. Дмитрий 20 февраля 2020 # 0
    Сергей, приветствую.
    Подскажи почему в плагине MinifyX нет открывающего тега <?php, а если его добавить и сохранить, то он удаляется?:(
    Создал вот здесь тему.
    1. Сергей Шлоков 21 февраля 2020 # 0
      MODX при сохранении в базу вырезает тег "<?php" у плагинов и сниппетов. Это можно проверить заглянув в соответствующие таблицы. А вот при отображении кода плагина или сниппета этот тег добавляется, по моему где-то в контроллере. Почему конкретно в этом плагине не добавляется не знаю. Возможно этот контроллер не срабатывает как нужно. Сейчас проверить не могу. Но эта ситуация никак не влияет на работу плагина. Единственная проблема — это подсветка кода.
      1. Сергей Шлоков 28 февраля 2020 # 0
        Забавная хрень. В общем, в контроллере проверяется присутствие тега "<?php" не в начале скрипта, а вообще. А так как в плагине есть такой код
        ...
        $replace = [
            "/<\?php/" => '<?php ',
            ...
        
        то условие не срабатывает, и тег не добавляется. Вот такая миленькая бага.:r

        Самое простое решение — прямо в плагине разбить строку '<?php' на две — '<'. '?php'.
      2. Владимир 09 июня 2021 # 0
        Обратите внимание что при минификации bootstrap5 css проблема с calc так и не ушла.
        К примеру класс .row в bootstrap5:
        .row {
            --bs-gutter-x: 1.5rem;
            --bs-gutter-y: 0;
            display: flex;
            flex-wrap: wrap;
            margin-top: calc(var(--bs-gutter-y) * -1);
            margin-right: calc(var(--bs-gutter-x)/ -2);
            margin-left: calc(var(--bs-gutter-x)/ -2);
        }
        
        И вот что возвращает после минификации Minify:
        .row {
            --bs-gutter-x: 1.5rem;
            --bs-gutter-y: 0;
            display: flex;
            flex-wrap: wrap;
        }
        

        Вы должны авторизоваться, чтобы оставлять комментарии.

        Выделите опечатку и нажмите Ctrl + Enter, чтобы отправить сообщение об ошибке.