Gulp - Актуальное и исчерпывающее руководство для самых маленьких

[@wdm]

Рекомендую использовать модуль "compress-images" вместо "gulp-imagemin". Для стабильной работы рекомендую устанавливать pngquant-bin версии 6.0.0 и gifsicle версии 5.3.0. Команда для установки: npm i --save-dev compress-images gifsicle@5.3.0 pngquant-bin@6.0.0 del

[@СоняЧ-ь8с]

Спасибо огромное, как раз начала изучать gulp, а на любимом канале есть прекрасное видео на эту тему, плюс документация - это вообще, шедевр.

[@s9219871110]

Я в разных местах кормился (учился), но тут, дружище, ты удивительно объясняешь. Ты объясняешь назначение каждой строчки кода, и получается не бездумная писанина, а вникание в каждый символ. Минин отдыхает в этом плане. Великолепно! Я аплодирую стоя, ну и этот комментарий ради "комментария" =) Походу все твои уроки я оплачу в ближайшее время))))

[@bannikon]

Достойно уважения! Перевёл документацию, залил на свой сайт и снял понятное видео. Отлично!

[@Дмитрий-г7я7п]

Спасибо за такое подробное объяснение; наконец-то я начал понимать, как работает Gulp

[@Metal1599Pro]

Как же я тебя ждал :)

[@АлександрКураленко-щ2щ]

Лучшее устное и наглядное объяснение, спасибо . Наконец всё понял.

[@МаксимКирилин-з4г]

"Дорогие друзья" этот парень хорош!!! Очень полезный урок Это мой первый опыт работы Gulp и первый урок. После просмотра чувствую как будто всю жизнь работал с Gulp))

[@ВоинственныйХомяк-к8р]

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

[@alexandercelevra2393]

Лёш, спасибо тебе! Я помню самую свою первую сборку для тестового задания по старой версии этого видео, когда оно только вышло. Сидел в ночную смену на заводе и писал в Notepad++ на полудохлом ПК в перерывах между сменой деталей на станке

[@_SilentGames]

Ты заслужил место в раю!!!! Очень полезный урок!!! Спасибо большое за твой труд!!! "Gulp для самых маленьких"

[@mr_boogie]

Вот за что мне нравится youtube) Спасибо за открытый, разжеванный, актуальный урок по gulp'у. Лайк и подписка однозначно)

[@МаринаБаландина-э5ч]

Просто огромное спасибо! Самый маленький всё понял!) Очень хорошо все изложено, я просто в восторге!)

[@ОльгаДмитриевна-р9ы]

Да, действительно исчерпывающее руководство!!

[@kotofun]

Спасибо за полезное видео! Объяснено доступным языком и достаточно быстро. Автору респект!

[@sauronin2058]

Очень благодарен за это руководство и подробное разъяснение, как все устроено. Но особенно спасибо за перевод статей. Вы очень сильно помогли изучить gulp)

[@АннаХмельницкая-ф8и]

Спасибо огромное за Ваш труд!!! Всё интересно и доходчиво, без воды, максимум пользы!)) Обязательно Всем рекомендую к просмотру!))

[@gexplozer]

Разобрался с переходом от третьей версии. Спасибо большое!

[@ivanshynkarenko8989]

Круто, очень хочется побольше новых видео, особенно по "джедаям"

[@Vladimir-ww1be]

Обалденный конетнт спасибо большое за урок!!!

[@erik_james]

Чувваак, спасибо!! Сейчас 2 часа ночи, мне до 8-ми утра надо сдать тестовое задание на позицию верстальщика))) Только по твоему уроку получается на ходу понимать и применять Гульпик)

[@alfa_main]

Отдельное спасибо автору за адрес через который можно просматривать с любого другого устройства проект) Спасибо вам за вашу работу, очень хорошее дело делаете)

[@GlebKrylov]

Спасибо что разжевал все очень подробно, очень полезно для новичков вроде меня.

[@mini8622]

Спасибо большое за подробное объяснение!! И за легкий смех над грустным котом))

[@alexvolkov6269]

15 минут назад. Сейчас тоже начал Gulp учить. Очень быстро стал верстать + SASS + PUG + Bootstrap

[@alexius_diadoch]

Спасибо за урок! Замечательное изложение темы, в результате готовый gulpfile для сборки проектов! Респект!

[@mafiaekd]

Спасибо огромное)

[@Тёмыч-ъ6и]

Спасибо! Мне походу одному думается что вот раньше был галп так галп! ))) Как буд-то вчера в машине руль был на месте, а сегодня джойстик с кнопочками, притом что кнопочки подписаны по своему.

[@yahyo5452]

Урааааа - я закончил урок и всё было понятно, большое спасибо Масере :) - Будь здоров всегда

[@boneshock7549]

Алексей большое вам спасибо, за ваш труд!!!

[@mr-_-robot5873]

Лучшая подача материала,что я видел, спасибо!

[@РоманКоптев-л3ж]

Спасибо, очень полезный урок!

[@СаняПлюс-у7й]

Спасибо, как раз собирался обновлять свой галп и тут такая помощь, особое спасибо за доки, я хоть английский и знаю, но на русском все таки проще читается. К себе в сборщик я еще ко всему этому добру babel добавил) Жду новых джедаев верстки!

[@vladislavche7603]

Спасибо огромное, воспользовался уроком, очень пригодилось

[@romatokar3516]

Только недавно видел ваш перевод и перечитав его полностью переделал сборку, а тут ещё видос

[@Rusu421]

Люблю галп. Где еще найдется модуль, для исправления работы других модулей

[@vladislavsite]

Крутой гайд по gulp - узнал много нового про 4 версию и gulp в целом!

[@stasonsv52]

Крутое объяснение!

[@Ilya-gv6kb]

Спасибо ! Очень полезно / понятно / позитивно )) Есть ещё хорошая штука в gulp - конвертер шрифтов , и их авто подключение , если об этом расскажите очень думаю будет полезно , спасибо ! )

[@КонстантинКренский]

Спасибо тебе, дружище, за твои труды!!!

[@АннаЦибель]

Спасибо большое за видео, очень помогло!!!!)))

[@maxengio]

Как всегда все круто, структурированно и по делу

[@yilinvlogs9102]

Спасибо, очень полезный урок

[@ArthurGermanovich]

это случилось, ура новый видос!

[@webprogrru3225]

Отличный курс

[@rem2764]

спасибо за проделанную работу, джедай

[@almaz.kamaliev]

Спасибо за уроки и за труд!

[@ДенисКазанцев-ь7ъ]

Благодарю за видео, Алексей. Как всегда на высоте)

[@GaldarTurin]

Благодарю за такие видео !

[@РусланДенисламов-ш8ш]

Спасибо тебе святой ты человек!!!!

[@zhukovpro]

Алексею сначала лайк и коммент, потом уже только смотреть видео))

[@БогданЖученко-д6и]

Спасибо большое за проделанную работу, с меня лайкос и коммент, а подписка уже давно!))

[@christinalozova]

Супер, спасибо! Как всегда очень доходчиво и информативно. Лучики добра вам

[@АрсенийКособрюхов-щ3о]

Спасибо, большое! Все изложено очень просто и подробно

[@mrs.doubtfire8197]

Спасибо тебе, милчеловек!

[@ЮрийБондаренко-ш9с]

Я тебя ждал, выпускай по чаще видео, ты меня научил как с Опенкартор работать. Жду теперь Октабрь. P.S. Вордпрес надоел с его костылями

[@ЕгорОвчинников-ь2г]

Спасибо за видео! Очень полезно!

[@kostukov75]

Большое спасибо за полезный контент

[@eka1929]

Спасибо за труд ! ☆

[@vitaliihura9808]

Отличный урок! Спасибо!)

[@саша-ю1в9ь]

спасибо!!!!!!!!! лайк - всегда) ждем джедая

[@ЯнаАлександрова-ы8ф]

Спасибо!!! Понятно и полезно!

[@Кирилл-э9к8п]

Спасибо за объяснение и перевод. Думаю разделение видео по тайм-кодам к определенному модулю или теме будет очень удобно для зрителей канала. И еще может разделение длинного объяснение и установкой модуля также по тайм-коду, чтобы можно было несколько раз посмотреть само объяснение

[@АннаПатренкина]

Добрый день , очень классный урок спасибо вам огромное за труд , единственное что у меня возник вопрос если к разным файлам html нужно подключить свой скрипт как это сделать ведь все собирается в один файл , нужно прописывать каждый таск отдельно ?

[@wdm]

Здравствуйте. Нет, все HTML файлы обрабатываются пачкой. Отдельные таски прописывать не нужно.

[@evgeniys.4325]

Спасибо, очень полезно)

[@vasyasolovyov6702]

Ждём вёрстку 💪🏼

[@thesijisgame6590]

Спасибо большое

[@Гитарфан]

СПАСИБО!!!!

[@Валерия-я2в]

Добрый день. Помогите, пожалуйста. Не могу установить gulp-sass, выдает ошибку. Уже все форумы обшарила, но ответа на вопрос не нашла. Что ни делаю - ничего не работает

[@advokats086]

МАЭСТРО СПАСИБО ЗА НАУКУ... !!! ПОДСКАЖИ КАК НАСТРОИТЬ GULP НА ОПРЕДЕЛЕННЫЙ БРАУЗЕР ЕСЛИ ПОСЛЕДНИХ НЕСКОЛЬКО В ОС...

[@wdm]

Нужный браузер сделать браузером по-умолчанию в системе.

[@СергейЛуняк-д5е]

про грустного кота сам пошутил сам посмеялся) но я честно говоря посмеялся тоже)

[@НикитаЛосев-х3э]

Спасибо тебе, Мастер! 2 месяца, имея жуткий дефицит времени, я пытался хоть что-то сделать с Галпом, не зная при этом JS! И только разобрав данный урок на "атомы" начал что-то понимать (а смотрел много у кого)! Есть такой вопрос: а почему рекомендуется заменить gulp-imagemin на compress-images? Загуглил, вроде очень многие imagemin пользуются...

[@wdm]

Здравствуйте. Используйте imagemin. Реализация подключения есть в стартере: github.com/agragregra/OptimizedHTML-5

[@ВладимирПопов-ч3х]

Урок классный! Подскажи, как работать с php файлами?

[@wdm]

kzbin.info/www/bejne/rXaQgJxuabp9jqc

[@pavelp2501]

Добрый день! Спасибо за все курсы, в том числе и платные. Хочу Вас попросить дополнить конечный код и текстовое описание установкой плагина ftp-vinil и диплоем на хостинг. Спасибо!

[@wdm]

Здравствуйте. В настоящее время рекомендую использовать Rsync: github.com/agragregra/OptimizedHTML-5/blob/master/gulpfile.js#L123

[@mew6085]

я просто абалдел, в конце такой чееееее, как это собралось как это мать твою работает xD

[@АрташесДживанян-л1з]

Добрый день, подскажите пожалуйста, как я могу подключить и конкатенировать стронние css файлы, например normalize.css или bootstrup?

[@dotg6618]

! Спасибо

[@sorbonshukurov1115]

Супер классс

[@СергейТ-ц3ь]

Нормуль, спс! автор, подскажи плз, что у тебя за тема в vs-code?

[@wdm]

One Dark Material Theme. Sublime Text.

[@nekitsan3837]

Чуваки, у кого не работает просмотр(browsersync) с другого устройства, скорее всего данный ip занят кем-то, у меня был занят виртуальной машиной. Увидел через ipconfig

[@Blue-oy7tz]

Наконец то)

[@azimutaz2810]

Здраствуйте. Спасибо за вашу работу. Подскажите, а сушествует npm плагин который будет конкотенировать не весь файл например jquery, а только те функции которые используются в проекте?

[@medviol]

Как настроить сборщик, если я стили пишу на SCSS, а не SASS?

[@wdm]

Импортируйте Scss в главный Sass-файл и пишите тем синтаксисом, который нравится больше.

[@medviol]

@@wdm Благодарю! Не додумался)

[@NeoJohnSmit]

thank you brother ))

[@asifabbasov3801]

Автор у меня вопрос. Я могу вместо папки "app" создать папку "src"?

[@alexandrameas4436]

Спасибо! Супер видео. Есть вопросик: а почему для const concat = require('gulp-concat') надо убирать create?

[@amg1566]

👍👍👍👍👍

[@bird-0202]

Спасибо))

[@dotg6618]

ребзя, если у кого gulp ругается на compress-images, то меня спас вариант " npm i --save-dev gulp-imagemin@7.0.0 " и продолжаете писать код как указано в видео

[@uchiha1503]

Кто может подсказать какую ОС он использует?

[@wdm]

В данном видео я использовал macOS

[@WockeezChannel]

Можно ли вырезать media запросы и вынести в отдельный файл?

[@wdm]

Без проблем. Просто удобно работать именно в том селекторе, который стилизуем и с медиазапросами. В файле, который будет выделен для медиа-запросов придется повторять всю цепочку селекторов.

[@WockeezChannel]

@@wdm какие для этого плагины нужно использовать? Нужно скомбинировать все медиа запросы и их вставить в отдельный файл под названием media.css, а остальные стили в style.css.

[@wdm]

Плагины не нужны. Если используете препроцессор, реализацию и боейкпоинты можно посмотреть здесь: github.com/agragregra/start_html/blob/master/_optimized_gulp_sass/sass/_media.sass

[@wdm]

Если без препроцессора, то вот пример: github.com/agragregra/Simple-Starter/blob/main/css/media.css

[@ПавелГ-р1п]

Привет всем! Не подскажет кто, на WSL Gulp не срабатывают функции с SASS и browserSync (При запуске конвертирует, а в последствии не работает)? На реальной Ubuntu и с помощью консоли Git Bash работает. Хотелось бы работать именно в WSL, т.к. в VS Code терминал Git Bash не сохраняет команды.

[@wdm]

Я использую сейчас Git Bash. Для того, чтобы сохранялись команды, следует: nano ~/.bash_profile PROMPT_COMMAND='history -a' Подробнее: webdesign-master.ru/blog/docs/webdev-without-wsl.html

[@trashaccount5492]

Спасибо за урок на 4 гульпе. Почему мы теперь не используем bower?

[@wdm]

В основном используем npm, но иногда и bower не грех)

[@ManiacMariAimi]

в процессе запуска gulp browsersync появилась ошибка "о невозможности загрузки файла gulp.ps1, так как выполнение сценариев отключено в этой системе". Так что пришлось в командной строке от имени админа колдовать над политиками выполнения скриптов в powershell, только это и помогло. Если у кого есть схожие проблемы, то рекомендации есть в офиц.документации: docs.microsoft.com/ru-ru/previous-versions/windows/powershell-scripting/hh847748(v=wps.640)

[@wdm]

Какая сборка и версия? Home/Pro?

[@attentionSnowMix]

документация помогла, спасибо

[@ruslanvybornov1237]

в чем причина не запускается браузер синк, ошибок в консоле нет, но в браузере пишет Cannot GET

[@wdm]

Скорее всего, у вас нет индексного файла «index.html» в папке проекта.

[@ruslanvybornov1237]

@@wdm очень странно, когда кидаю index.html в папку где лежит gulpfile, то все ок, но когда index.html лежит в app то он не видит его, хотя путь задал, в чем причина не могу понять

[@wdm]

Проверьте правильность указания baseDir: server: { baseDir: 'app/' }, // Указываем папку сервера

[@is1ander82]

Почему используются константы, а не переменные через var или let? Видел похожую сборку, только там переменные были. Есть какая-то разница?

[@alekseypakriev4584]

Учи js и все вопросы отпадут. Var уже давно никто не использует. let и const практически одно и тоже, за исключением того, что const нельзя переопределить.

[@MegaTesei]

Спасибо. Хороший разбор. Мне понравилось. Есть вопрос: Почему логика выгрузки готового результата имеет промежуточный итог? К примеру, обработанные картинки выгружаются вначале в папку исходника, а затем копируются в финальную папку (dist). То же самое с минифицированными файлами. Почему не сделать напрямую выгрузку в финальную папку dist, без функции копирования?

[@wdm]

Потому, что функция сборки не нужна при посадке вёрстки на CMS. Это просто опция.

[@Всеволод-ч1в]

Добрый день, Алексей! Спасибо за полезные материалы. У меня возник маленький вопрос: Я увидел одну разницу в содержании урока видео и текстового содержания урока на Вашем сайте: В качестве минимизации изображений есть два разных модуля. Поэтому вопрос: можно ли использовать для модуля compress-images, который Вы предлагаете на сайте (текстовой вариант урока) применять как в дополнения для того, чтобы не минифицировались много раз одни и те же картинки, использовать модуль gulp-newer, так как Вы предлагаете это сделать на Видео для другого модуля imagemin, который отстутствует в уроке текстовом на Вашем сайте ?

[@wdm]

Здравствуйте. Можете использовать любой из предлагаемых модулей. Но в случае с использованием gulp-imagemin, как в уроке, вам необходимо использовать пакеты модульно, как это сделано в OptimizedHTML 5: github.com/agragregra/oh5

[@ИльяКостеев-с5т]

подскажите,как полностью удалить Gulp из системы?т.е глобально очистить его вообще