Gulp: Епизод 3 - Возвращение Джедая

15 Октября 2016
Eugene Shuliakivskyi
Верстка
4822

the force will be with you. always

Это заключительная статья из цикла статей о gulp, в ней мы рассмотрим вопрос быстродействия, а также некоторые другие особенности работы с gulp.

Вернемся к вопросу быстродействия, о котором я упоминал в самом начале - сравним скорость выполнения задач в трех случаях - при использовании SASS на Ruby, о котором было написано в нашей статье, Grunt и Gulp. Задачей будет скомпилировать набор .scss файлов.

Ниже вы можете визуально оценить скорость выполнения этой задачи в трех случаях:

1. SASS на Ruby
2. Grunt
3. Gulp

Преимущество в быстродействии при использовании gulp очевидно.

Выполнение задач по порядку

Если вы решили в своем проекте сразу при разработке использовать сжатые стили, а не сжимать их потом отдельно, вам необходимо позаботиться о том, чтобы ваша задача сжатия стилей выполнялась только после того, как закончилась компиляция SASS, иначе будет сжата предыдущая версия файла стилей, єто нам не подходит.

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

Наглядно:

Наш таск "watch" отслеживает изменения в файлах, когда такие происходят, он запускает таски "sass " и "cssmin".

Обратите внимание! Для достижения синхронности выполнения задач, нам необходимо:

a) возвращать поток (таск "sass") - в таком случае мы будем знать, когда этот таск закончился.
б) явно указать, что таск "cssmin" зависит от выполнения таска "sass" -

Последней темой, которую разберем сегодня, будет обработка ошибок, которые мы, так или иначе, будем допускать при написании стилей. Допустим, мы написали задания на компиляцию стилей и успешно его используем.

На первый взгляд все работает прекрасно, и не за что беспокоиться. Но мы допускаем ошибку в SASS - например, используем переменную, которую нигде не объявлено - и при компиляции получаем ошибку.

После этого, исправив ошибку и запустив компиляцию, gulp не реагирует, он просто "отвалился" и нам приходится его перезапускать - переключиться на консоль (alt + f12), стрелкой вверх выбрать задачу gulp и продолжить работу. Хотя такие ситуации возникают относительно редко, но создают дополнительные неудобства.

Как видим, gulp выдал ошибку - Unhandled 'error' event - мы никак не обрабатываем ошибки. Поэтому для таких нужд можно использовать плагин gulp-util, а конкретнее его возможность возвращать логи. Таким образом, при возникновении ошибки, она будет обрабатываться нашим плагином а мы, в свою очередь, избавимся от головной боли с перезапуском gulp.