Skip to content

Latest commit

 

History

History
147 lines (106 loc) · 12.3 KB

README.ru.md

File metadata and controls

147 lines (106 loc) · 12.3 KB

english | русский


logo

SVGO NPM version Dependency Status Build Status Coverage Status

SVG Optimizer – это инструмент для оптимизации векторной графики в формате SVG, написанный на Node.js.

Зачем?

SVG-файлы, особенно – экспортированные из различных редакторов, содержат много избыточной и бесполезной информации, комментариев, скрытых элементов, неоптимальные или стандартные значения и другой мусор, удаление которого безопасно и не влияет на конечный результат отрисовки.

Возможности

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

Сегодня у нас есть:

  • [ cleanupAttrs ] удаление переносов строк и лишних пробелов
  • [ removeDoctype ] удаление doctype
  • [ removeXMLProcInst ] удаление XML-инструкций
  • [ removeComments ] удаление комментариев
  • [ removeMetadata ] удаление <metadata>
  • [ removeTitle ] удаление <title> (отключена по умолчанию)
  • [ removeDesc ] удаление <desc> (по умолчанию только незначимых)
  • [ removeUselessDefs ] удаление элементов в <defs> без id
  • [ removeEditorsNSData ] удаление пространств имён различных редакторов, их элементов и атрибутов
  • [ removeEmptyAttrs ] удаление пустых атрибутов
  • [ removeHiddenElems ] удаление скрытых элементов
  • [ removeEmptyText ] удаление пустых текстовых элементов
  • [ removeEmptyContainers ] удаление пустых элементов-контейнеров
  • [ removeViewBox ] удаление атрибута viewBox, когда это возможно
  • [ cleanupEnableBackground ] удаление или оптимизация атрибута enable-background, когда это возможно
  • [ minifyStyles ] уменьшает содержимое элементов <style> с помощью CSSO.
  • [ convertStyleToAttrs ] конвертирование стилей в атрибуте style в отдельные svg-атрибуты
  • [ convertColors ] конвертирование цветовых значений: из rgb() в #rrggbb, из #rrggbb в #rgb
  • [ convertPathData ] конвертирование данных Path в относительные или абсолютные координаты, смотря что короче, конвертирование одних типов сегментов в другие, удаление ненужных разделителей, умное округление и тому подобное
  • [ convertTransform ] схлопывание нескольких трансформаций в одну, конвертирование матриц в короткие алиасы и многое другое
  • [ removeUnknownsAndDefaults ] удаление неизвестных элементов, контента и атрибутов
  • [ removeNonInheritableGroupAttrs ] удаление ненаследуемых "презентационных" атрибутов групп
  • [ removeUselessStrokeAndFill ] удаление неиспользуемых атрибутов stroke-* и fill-*
  • [ removeUnusedNS ] удаление деклараций неиспользуемых пространств имён
  • [ cleanupIDs ] удаление неиспользуемых и сокращение используемых ID
  • [ cleanupNumericValues ] округление дробных чисел до заданной точности, удаление px как единицы измерения по-умолчанию
  • [ moveElemsAttrsToGroup ] перемещение совпадающих атрибутов у всех элементов внутри группы <g>
  • [ moveGroupAttrsToElems ] перемещение некоторых атрибутов группы на элементы внутри
  • [ collapseGroups ] схлопывание бесполезных групп <g>
  • [ removeRasterImage ] удаление растровых изображений (выключено по умолчанию)
  • [ mergePaths ] склеивание нескольких Path в одну кривую
  • [ convertShapeToPath ] конвертирование простых форм в Path
  • [ sortAttrs ] сортировка атрибутов элементов для удобочитаемости (выключено по умолчанию)
  • [ transformsWithOnePath ] применение трансформаций, обрезка по реальной ширине, вертикальное выравнивание по центру и изменение размеров SVG с одним Path внутри
  • [ removeDimensions ] удаляет атрибуты width/height при наличии viewBox (выключено по умолчанию)
  • [ removeAttrs ] удаляет атрибуты по указанному паттерну (выключено по умолчанию)
  • [ addClassesToSVGElement ] добавляет имена классов корневому элементу <svg> (выключено по умолчанию)
  • [ removeStyleElement ] удаляет элементы <style> (выключено по умолчанию)

Хотите узнать, как это работает и как написать свой плагин? Конечно же, да!.

Как использовать

$ [sudo] npm install -g svgo
Выполнение:
  svgo [OPTIONS] [ARGS]

Параметры:
  -h, --help : Помощь
  -v, --version : Версия программы
  -i INPUT, --input=INPUT : Входной файл, "-" для STDIN
  -s STRING, --string=STRING : Входная строка SVG
  -f FOLDER, --folder=FOLDER : Входная папка, оптимизирует и перезаписывает все файлы *.svg
  -o OUTPUT, --output=OUTPUT : Выходной файл или папка (совпадает с входным по умолчанию), "-" для STDOUT
  -p PRECISION, --precision=PRECISION : Число цифр после запятой, переопределяет параметры плагинов
  --config=CONFIG : Файл конфигурации для расширения и замены настроек
  --disable=DISABLE : Выключение плагина по имени
  --enable=ENABLE : Включение плагина по имени
  --datauri=DATAURI : Результат в виде строки Data URI (base64, URI encoded или unencoded)
  --pretty : Удобочитаемое форматирование SVG
  --show-plugins : Доступные плагины

Аргументы:
  INPUT : Аналогично --input
  OUTPUT : Аналогично --output
  • с файлами:

      $ svgo test.svg

    или:

      $ svgo test.svg test.min.svg
  • со STDIN / STDOUT:

      $ cat test.svg | svgo -i - -o - > test.min.svg
  • с папками

      $ svgo -f ../path/to/folder/with/svg/files

    или:

      $ svgo -f ../path/to/folder/with/svg/files -o ../path/to/folder/with/svg/output
  • со строками:

      $ svgo -s '<svg version="1.1">test</svg>' -o test.min.svg

    или даже с Data URI base64:

      $ svgo -s 'data:image/svg+xml;base64,…' -o test.min.svg
  • с SVGZ:

    из .svgz в .svg:

      $ gunzip -c test.svgz | svgo -i - -o test.min.svg

    из .svg в .svgz:

      $ svgo test.svg -o - | gzip -cfq9 > test.svgz
  • с помощью GUI – svgo-gui

  • в виде веб-приложения - SVGOMG

  • как модуль Node.js – examples

  • как таск для Grunt – grunt-svgmin

  • как таск для Gulp – gulp-svgmin

  • как таск для Mimosa – mimosa-minify-svg

  • как действие папки в OSX – svgo-osx-folder-action

Пожертвования

BTC 1zVZYqRSzQ4aaL27rp3PLwFFSXpfs5H8r

Лицензия и копирайты

Данное программное обеспечение выпускается под лицензией MIT.

Логотип – Егор Большаков.