Универсальная сборка

Описываемая ниже схема является основной для большинства ситуаций. Только gulp и другие task runners позволяют реализовать генерацию сетки более удобным способом.

1. Создайте отдельный js-файл.

Например, в корне проекта. Данный файл мы будем запускать с помощью команды node. Единственное назначение файла - сгенерировать сетку по описанным настройкам.

2. Поместите в него стандартный код.

const smartGrid = require('smart-grid');
 
const options = {
   /* your grid settings here */
};
 
smartGrid('path-to-your-folder', options);

Например, если файл лежит в корне, а все препроцесрные файлы в src/less, то первым параметром будет './src/less'

3. Запустите файл.

С помощью команды node [filename]

Например, при имени файла smartgrid.js в консоли нужно написать node smartgrid.js

В консоли появится сообщение об успешной генерации сетки, либо информация об ошибках, возникших в процессе создания сетки.

4. Подключите созданный файл в свой код.

Если вы привыкли работать с препроцессорами, данный шаг не вызовет затруднений. Просто аккуратно пропишите путь при импорте сгенерированного файла в основной.

Если в процессе разработки проекта вам потребуется поменять настройки сетки - просто отредактируйте их и запустите файл также как на шаге №3.

Обращаем внимание на то, что генерация сетки - гораздо более редкая операция, чем компиляция препроцессорного кода. В идеале сетка продумывается один раз на этапе анализа макета. В реальности в процессе разработки приходится несколько раз редактировать контрольные точки сетки.