ݺߣ

ݺߣShare a Scribd company logo

Around the Gulp — Андрей Яманов — MoscowJS 13

•
•
MoscowJS
MoscowJS

История перехода с Grunt на Gulp в крупном проекте. Краткий обзор плагинов, решение типовых (и не очень) задач с их помощью.

1 of 18
Download to read offline
tenphi.me
Around the Gulp — Андрей Яманов — MoscowJS 13
Around the Gulp — Андрей Яманов — MoscowJS 13
безусловный лидер среди подобных решений (2013 год) упрощает разработку и управление задачами добавляет продвинутый livereload простой и понятный подход огромное количество плагинов и легко написать свой всё хорошо документировано легко интегрируется с системой зависимостей одно решение для многих задач
600+ строчек кода Росло кол-во задач. Код превращался в помойку. Его становилось сложно поддерживать. Многое тормозило
выполняется синхронно запускает задачи в отдельном процессе каждая задача выполняется в отдельном процессе каждая задача по факту перезапускает gruntfile
Around the Gulp — Андрей Яманов — MoscowJS 13
Boilerplate (grunt » gulp) + express + angular gulpfile ~100 строк 3-4 часа на миграцию plugins: gulp-util, gulp-watch, gulp-connect, gulp-plumber, gulp-rename, gulp-size, gulp-rev, gulp-fingerprint, gulp-clean, gulp-usemin, gulp-minify-css, gulp-minify-html, gulp-uglify, gulp-imagemin, gulp-html2js, gulp-ngmin
код стал намного чище функционал одной задачи четко локализован кол-во кода уменьшилось watch стал работать более отзывчиво многие плагины были заменены на обычные nodejs-модули красивый лог :) (плюс) комплексный сценарий задач был реализован с помощью уже существующих плагинов
Асинхронность не всегда хорошо (решение: run-sequence) Streams - намного сложнее прямой работы с файлами Очень плохо документировано (в том числе большинство плагинов) Сложнее написать свой плагин
Around the Gulp — Андрей Яманов — MoscowJS 13
Доставка контента (+watch) Тестирование (+watch) Сборка
реализуется напрямую через nodejs-модули: express, connect и т.д. хороший пример реализации livereload через tiny-url: gist.github.com/aslansky/8741515
gulp-karma? Вероятно, нет. Разработчики karma предлагают использовать API напрямую и почитать замечательную статью Why you shouldn't create a gulp plugin
многие популярные плагины не имеют полной поддержки потоков большинство компиляторов: less, coffee и т.д. возможны проблемы с генерацией sourceMaps сборка и версионирование файлов комплексная задача
Простые сценарии описываются тривиально gulp.task('compile', function(){ gulp.src(scriptFiles) .pipe(concat({fileName: pkg.name+".js"}) .pipe(minify()) .pipe(gulp.dest('./dist/')); });
(продвинутый gulp-fingerprint) http://github.com/tenphi/gulp-revplace Полная поддержка потоков Поиск asset'ов по исходному коду с помощью regexp'а Генерация новых путей для asset'ов и замена их в исходном коде Выгрузка всех найденных asset'ов в конечную директорию в стадии разработки, но текущая версия достаточно функциональна
полезные ссылки: github.com/gulpjs/ blog.ponyfoo.com/2014/01/27/my-first-gulp-adventure slides.com/contra/gulp github.com/substack/stream-handbook мои контакты: @tenphi tenphi@gmail.com github.com/tenphi

More Related Content

Around the Gulp — Андрей Яманов — MoscowJS 13