Gulp: Епизод 3 - Возвращение Джедая
- 15 Октября 2016
- Eugene Shuliakivskyi
- Верстка
- 5141
Это заключительная статья из цикла статей о 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.
Результат - плагин выводит информацию об ошибке, а gulp продолжает работать.
На сегодня все, надеюсь после этого ваш процесс разработки станет хоть немного проще и удобнее.