Сборка иконок для сайта через nodejs и grunt

В этой публикации речь пойдет о тех самых файлах favicon.ico, по которым можно быстро узнавать сайт в выдаче поисковых систем или среди горы закладок в браузере. Для своих проектов у меня встала такая задача, но в opensorce готовых решений я найти не смог. Возможно, плохо искал, или, может, такие решения уже появились, но во всяком случае я, как всякий нормальный программист, написал свое решение. Со временем его немного подморофетил и выложил в opensource, собственно, о нем я сейчас и хочу рассказать.

Мое решение написано для nodejs и системы сборки grunt и выложено в npm, пакет называется grunt-favicon. Расширение представляет из себя задачу для grunt, которое из любого графического формата может делать иконки для сайта.
Приведу сразу пример:

Файл Gruntfile.js

module.exports = function (grunt) {
    grunt.loadNpmTasks("grunt-favicon");
    grunt.initConfig({
        favicon: {
            options: {
                // тут пишутся глобальные опции расширения
            },
            create_icons: {
                options: {
                    // а тут пишутся опции каждой отдельной таски,
                    // если они отличаются от глобальных
                },
                files: [
                    {
                        ext: ".ico",
                        expand: true,
                        dest: "build/images",
                        cwd: "sources/images",
                        src: ["*.png", "*.jpg"]
                    }
                ]
            }
        }
    });
};

Это пример конфигурации Gruntfile.js, в которой создана задача favicon:create_icons, которая для каждого файла *.png или *.jpg из папки sources/images создаст аналоги, но только иконки и разместит их в папке build/images с теми же названиями и путями.

Запустить такую задачу можно из командной строки при помощи команды:

grunt favicon:create_icons

Но прежде необходимо установить само расширение:

npm install grunt-favicon --save-dev

У расширения не так много опций, всего 2 штуки:

• countOfImages — количество изображений, которое будет включать в себя иконка. Размер вложенных изображений строго предопределен: 16x16, 32x32, 48x48, 64x64, 128x128, 256x256. Например, если задано 3, то иконка будет содержать 3 изображения: 16x16, 32x32, 48x48. Максимальное значение — 6.
• colorDepth — глубина цвета в количестве битов (от 1 до 8).

У моего решения есть зависимость — это установленный глобально ImageMagick. Для Windows дистрибутив можно скачать с официального сайта, для Debian, Ubuntu или Mint пакет можно установить из командной строки:

sudo apt-get install imagemagick

Для Redhut, Centos или Fedora пакет можно устанавливать так:

sudo yum install ImageMagick

Преобразовывать можно любые графические форматы, с которыми умеет работать ImageMagick, а он умеет работать с очень многими форматами.

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

Расширение grunt-favicon
Официальный сайт ImageMagick