grunt-bemaker v0.2.0
grunt-bemaker
Grunt-плагин для сборки БЭМ-проекта с помощью bemaker
Приступая к работе
Если вы не использовали Grunt раньше, то можете ознакомиться с вступительной инструкцией, в которой объясняется, как добавить Gruntfile в проект.
Установить этот плагин можно следующей командой:
npm install grunt-bemakerПосле установки, можно будет подключить плагин в вашем Gruntfile:
grunt.loadNpmTasks('grunt-bemaker');Использование
Для запуска сборки проекта, достаточно выполнить команду: grunt bemaker.
Сборка осуществляется с помощью bemaker.
Опции
Опция directories
Тип: string[]
Обязательный
Опция указывает расположение директорий с блоками.
Сборщик ничего не соберёт без указания расположения блоков.
Следующий пример задаёт сборку блоков из директорий common и phone:
{
directories: ['common', 'phone']
}Опция outname
Тип: string
Опция указывает имя сохраняемых файлов.
По умолчанию файлы сохраняются без имени, только с расширением.
Следующий пример задаёт сохраняемым файлам имя all:
{
outname: 'all'
}Опция outdir
Тип: string
Опция указывает директорию для сохраняемых файлов.
По умолчанию файлы сохраняются в текущую директорию.
Следующий пример задаёт директорию bundle для сохраняемых файлов:
{
outdir: 'bundle'
}Опция extensions
Тип: string[]
Опция указывает расширения для сохраняемых файлов.
По умолчанию сохраняются все найденные расширения.
Следующий пример задаёт к сохранению расширения .js и .css:
{
extensions: ['.js', '.css']
}Опция blocks
Тип: string[]
Опция указывает имена блоков, которые необходимо собрать.
По умолчанию в сборку включаются все найденные блоки.
Следующий пример задаёт к сборке только блоки button и input:
{
blocks: ['button', 'input']
}Опция dependext
Тип: string
Опция указывает расширение файлов, в которых сборщику следует искать зависимости блоков.
По умолчанию поиск зависимостей осуществляется в файлах с расширением .js.
Следующий пример задаёт поиск зависимостей в файлах .deps.js:
{
dependext: '.deps.js'
}Опция jsdoctag
Тип: string
Опция указывает имя JSDoc-тега, в котором сборщику следует читать зависимости блоков.
По умолчанию чтение зависимостей осуществляется в теге @bemaker.
Следующий пример задаёт чтение зависимостей в теге @deps:
{
jsdoctag: 'deps'
}Опции before и after
Тип: boolean|Function
Опции отменяют или изменяют комментарий перед и после содержимого каждого файла.
По умолчанию в собранном файле перед содержимым каждого файла устанавливается такого вида комментарий:
/* before: blocks/button/button.css */Следующий пример отменяет установку этого комментария:
{
before: false
}Для изменения комментария можно указать функцию, которая должна возвращать строку и принимает следующие параметры:
- {string}
absPathАбсолютный путь до файла - {string}
relPathОтносительный путь до файла - {string}
extnameПолное расширение файла (например дляfile.ie.cssбудет.ie.css) - {number}
indexИндекс файла - {number}
lengthКоличество файлов
Пример изменения комментария:
{
before: function(absPath, relPath, extname, index, length) {
return '/* custom before: ' + absPath + ' */\n';
}
}