around the gulp — Андрей Яманов — moscowjs 13

Post on 08-May-2015

406 Views

Category:

Internet

0 Downloads

Preview:

Click to see full reader

DESCRIPTION

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

TRANSCRIPT

tenphi.me

безусловныйлидерсредиподобныхрешений(2013год)упрощаетразработкуиуправлениезадачамидобавляетпродвинутыйlivereloadпростойипонятныйподходогромноеколичествоплагиновилегконаписатьсвойвсёхорошодокументированолегкоинтегрируетсяссистемойзависимостейоднорешениедлямногихзадач

600+строчеккода

Рослокол-возадач.Кодпревращалсявпомойку.Егостановилосьсложноподдерживать.Многоетормозило

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

каждаязадачавыполняетсявотдельномпроцессекаждаязадачапофактуперезапускаетgruntfile

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-намногосложнеепрямойработысфайламиОченьплоходокументировано(втомчислебольшинствоплагинов)Сложнеенаписатьсвойплагин

Доставкаконтента(+watch)Тестирование(+watch)Сборка

реализуетсянапрямуючерезnodejs-модули:express,connectит.д.

хорошийпримерреализацииlivereloadчерез tiny-url:gist.github.com/aslansky/8741515

gulp-karma?Вероятно,нет.

РазработчикиkarmaпредлагаютиспользоватьAPIнапрямуюипочитатьзамечательнуюстатью

Whyyoushouldn'tcreateagulpplugin

многиепопулярныеплагинынеимеютполнойподдержкипотоков

большинствокомпиляторов: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-adventureslides.com/contra/gulpgithub.com/substack/stream-handbook

моиконтакты:@tenphi

tenphi@gmail.comgithub.com/tenphi

top related