#2 Gulp сборка проекта | javascript

Подписаться 3,1 тыс.

Просмотров 2,6 тыс.

50% 1

Материалы урока
Код: github.com/DmitryBerdnikov/gu...
npm i browserify babelify vinyl-source-stream vinyl-buffer gulp-uglify gulp-sourcemaps gulp-if --save-dev
Ссылки урока
browserify: browserify.org/
babelify: www.npmjs.com/package/babelify
gulp + browserify: github.com/gulpjs/gulp/blob/m...
npm vinyl-buffer: www.npmjs.com/package/vinyl-b...
gul-uglify: www.npmjs.com/package/gulp-ug...
gulp-sourcemaps: www.npmjs.com/package/gulp-so...
gulp-if: www.npmjs.com/package/gulp-if
Связь со мной
Привет! Меня зовут Дмитрий Бердников, я frontend-разработчик.
На канале делюсь знаниями по веб-разработке.
VK: berdnikovdmitry
Telegram: t.me/berdnikovDima
#gulp #javascript #js
Таймкоды:
0:00 Интро
0:14 Настройка scripts
1:35 Установка browserify
4:49 Преобразование в vinyl-stream
6:12 Установка gulp-uglify и gulp-sourcemaps
8:42 Настройка gulp-if
11:01 Обработка ошибок browserify

Опубликовано:

22 июн 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 19

@user-up6es3nr6s 3 года назад

Таймкоды: 0:00 Интро 0:14 Настройка scripts 1:35 Установка browserify 4:49 Преобразование в vinyl-stream 6:12 Установка gulp-uglify и gulp-sourcemaps 8:42 Настройка gulp-if 11:01 Обработка ошибок browserify

@Aegon_Targarien 3 года назад

Отливное видео. Жду разработку сайта с помощью фреймворка в твоём исполнении

@user-rg7tx5ve7u 2 года назад

Хорошая информация

@user-le3iq8sz6r 2 года назад

Полезная информация

@semdevmaster 3 года назад

Какой же Вы трудный путь выбрали с этим browserify, проще через webpack пустить сборку всего js, в разы меньше плагинов понадобится и конфигурируется гораздо удобнее. И sourcemap-ы у gulp 4 уже есть из коробки, не нужен никакой для этого плагин - что ж никто не любит читать документацию, всё тянут и тянут из третьей версии борохло) Но за видос спасибо, первая часть была интересная, думал ну наконец-то хоть один про четверку нормально расскажет, но нет, на втором видосе подсдулась крутизна этого миникурса, а жаль. Очень рекомендую прочитать всю доку, там очень много интересного, а то чувствую, что дальше смотреть будет уже не очень интересно.

@user-up6es3nr6s 3 года назад

Привет! Спасибо за обратную связь. Насчет sourcemaps не знал, спасибо, надо будет ввести это в практику. Как-то зациклился я на gulp, поэтому почти не применял webpack, буду это исправлять. В этом мини курсе хочу поделиться своим опытом использования gulp, и может не все супер правильно и круто. Но лично я бы хотел некоторые вещи знать намного раньше, поэтому это может быть полезно кому-то еще. Буду рад, если оставите какую-нибудь крутую сборку, чтобы посмотреть практики.

@sergeytsapliy7071 3 года назад

@@user-up6es3nr6s Здравствуйте! Нашел такую сборку с использованием webpack github.com/andreyalexeich/gulp-scss-starter но она идет с поддержкой ie с 9 версии

@user-up6es3nr6s 3 года назад

@@sergeytsapliy7071 Здравствуй! Круто, спасибо, посмотрю

@user-ku6zf7jq3s 3 года назад

@@sergeytsapliy7071 по описанию крутая сборка, спасибо

@lenurabduramanov7134 2 года назад

Здраствуйте. У меня gulp не следит за html и другими папками. Выдаёт cannot get

@user-up6es3nr6s 2 года назад

Привет! Не совсем понял, где именно выдает ошибку cannot get? В браузере?

@user-bf8dx5hs9m 2 года назад

Test запускается из main.js? [sm]

@user-up6es3nr6s 2 года назад

Привет! Можешь подробнее описать вопрос?

@pinkhappybear4682 3 года назад

build так и не расскоментировал)

@user-up6es3nr6s 3 года назад

Привет! Можешь подсказать, что нужно раскомментить? github.com/DmitryBerdnikov/gulp-frontend-start-project/tree/main

@pinkhappybear4682 3 года назад

@@user-up6es3nr6s Всё норм, я увидел дальше, что раскоментировал, во втором уроке просто таск build остался комментарием. Подскажи, пожалуйста, у нас все скрипты собираются в 1 js файл, но у меня страниц много и мне по идее не нужны скрипты всех страниц, как быть в этом случае?

@user-up6es3nr6s 3 года назад

@@pinkhappybear4682 Сначала нужно подумать, нужна ли это оптимизация. Я в 90% случаев на простых сайтах бы использовал 1 js файл. Он загрузится 1 раз и потом будет браться из кэша. Но если нужно, то первое, что пришло на ум. Это в scriptsBuild не по одному файлу проходить main.js, а по массиву файлов. Но тогда нужно будет подумать, как сделать инкрементальную компиляцию (чтобы сборщик обрабатывал только те файлы, которые были изменены)