Gulp 4 сборка 2023, include файлов, конвертация шрифтов, работа с графикой, avif, webp, svg sprite

Поделиться
HTML-код
  • Опубликовано: 12 янв 2025

Комментарии •

  • @custercuster4918
    @custercuster4918 Год назад +34

    Вот это вечериночка) Большое спасибо за труд!

  • @g999ar
    @g999ar Год назад +9

    6:20 - картинки
    22:00 - newer
    31:40 - svg
    40:50 - шрифты
    1:00:20 - include HTML

  • @drawusoon
    @drawusoon Год назад +11

    УРА!) Наконец-то дождались!) В кои то веки будет хороший вечер, рады, что всё хорошо и ты снова с нами, вечериночки это то чего нам не хватало!)

  • @stanislav_tihanov
    @stanislav_tihanov Год назад +14

    Очень ждал продолжения сборки, Вадим спасибо тебе огромное!!! Выздоравливай!)

  • @fakesega6730
    @fakesega6730 Год назад +8

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

  • @sanjo6465
    @sanjo6465 Год назад +2

    От казалось бы айти это профессия серьезней некуда, и казалось бы обучение айти это вообще напряг сногсшыбательный. Но на какое из твоих видео не посмотрю и такая атмосфера будто с кентом на районе общаюсь и заодно как ты в конце сказал развиваюсь так как оно того стоит. Спасибо Вадим за столь важные, нужные и практические навыки которым ты обучаешь людей.

  • @KIREKSSHOW
    @KIREKSSHOW Год назад +13

    не хватает только марафонов по верстке :)
    спасибо за труд, учитель

    • @vadymprokopchuk
      @vadymprokopchuk  Год назад +1

      спасибо

    • @ob5804
      @ob5804 Год назад

      @@vadymprokopchuk Вадиме, покажіть, будь ласка, в наступній частині gulp модулі js? Окремий js файл на кожну сторінку(в мене не працють скрипти, дивлячись, як Ви робити, хочу зрозуміти, що ж не так в мене(. А ще як зменшувати відео, ну як картинки.

    • @ob5804
      @ob5804 Год назад

      @@vadymprokopchuk
      Вадиме, привіт. Питання по таску фонтс. Коли Ви не прописали *.* в return src('app/fonts/src'), то помилка була is not accepted type of font. Will just copy file, коли ж прописали *.*, то помилка вирішилась, а я прописала і одна помилка змінилась на цю
      [09:38:41] Starting 'fonts'...
      Read woff error on test-woff.woff - Will just copy file
      [09:38:53] Finished 'fonts' after 12 s
      шрифт test-woff.woff не переводиться в woff2( 9 все ок, а цей ну ніяк
      const fonter = require('gulp-fonter');
      const ttf2woff2 = require('gulp-ttf2woff2');
      function fonts() {
      return src('app/fonts/src/*.*')
      .pipe(fonter({
      formats: ['woff', 'ttf']
      }))
      .pipe(src('app/fonts/*.ttf'))
      .pipe(ttf2woff2())
      .pipe(dest('app/fonts'))
      }
      function building() {
      'app/fonts/*.*',
      }
      exports.fonts = fonts; Де моя помилка???

  • @upitel
    @upitel Год назад +1

    Вадим, спасибо!)
    Я полдня возился с установкой gulp-include. И ещё покамест нашёл что существует такая сборка... А здесь зашёл и сразу скачал готовую сборку. Будем трудиться!

  • @sad_gary
    @sad_gary Год назад +2

    Просто пушка! Огромное спасибо за свежачек!!

  • @Karifax
    @Karifax Год назад +5

    Насчет переноса sprite.stack.html 1:22:30
    Удалось избавится от переноса файла, написав строчку '!app/images/stack/sprite.stack.html' в конце списка, пример кода:
    return src(
    [
    'app/css/style.min.css',
    'app/images/*.*',
    '!app/images/*.svg',
    'app/images/sprite.svg',
    'app/fonts/*.*',
    'app/js/main.min.js',
    'app/**/*.html',
    '!app/images/stack/sprite.stack.html',
    ],

  • @super_snejinka
    @super_snejinka Год назад +1

    спасибо, Вадим! Люблю тебя!

  • @maxwatson4099
    @maxwatson4099 Год назад +1

    Спасибо, за хороший урок. Лично я для себя немного переделал сборку и разнес все функции по отдельным файлам. Создал папку gulp и там создал файлы под каждую функцию и потом уже инклюдил в gulpfile.

  • @OlegStepanenko-v5d
    @OlegStepanenko-v5d Год назад +1

    Шедеврально!!!

  • @dimasavchenko9150
    @dimasavchenko9150 Год назад +18

    Вадим, 'app/**/*.html' - эта запись переносила твой html в папку images))
    Для остальных, в функции building() в src можно явно указать 'app/pages/*.html', тогда лишние html не будет трогать

    • @ob5804
      @ob5804 Год назад

      Дякую)

    • @vadymprokopchuk
      @vadymprokopchuk  Год назад

      да да, все так и есть

    • @ВладимирДзех-я7з
      @ВладимирДзех-я7з Год назад +4

      @@vadymprokopchuk Если прописать 'app/pages/*.html', то в папку dist билдятся просто кусочки кода и комментарии от gulp-include. А вот если 'app/*.html', то уже всё норм) Поправьте если не так, но у меня всё шикарно

    • @elizabethsh8276
      @elizabethsh8276 Год назад +2

      @@ВладимирДзех-я7з я поменяла порядок компиляции файлов 'src/**/*.html',
      '!src/images/stack/*.html',
      'src/images/*.*',
      '!src/images/*.svg',
      'src/images/sprite.svg',
      и тогда stack не переносит

    • @КассакСаккас
      @КассакСаккас Год назад

      @@elizabethsh8276 привет как я могу с вами связаться Просто я учу gulp я в принц понял данной сборки но остались вопросы

  • @tatianaagapkina8658
    @tatianaagapkina8658 Год назад +1

    Ооо, это то, чего мы все так долго ждали!😁 Иду ставить чайничек🙌

  • @dimondimonov6417
    @dimondimonov6417 Год назад +2

    Ураааааа

  • @upwlqwp
    @upwlqwp Год назад

    Очень рады возвращению. Большое спасибо !)

  • @ОльгаФилатова-ф3й

    Спасибо! Лайк, подписка однозначно. Отличная сборка вышла, да и подача супер

  • @bog-1
    @bog-1 Год назад +1

    Бог и вся верстки вернулся

  • @grigoriyfomenko4927
    @grigoriyfomenko4927 Год назад

    Спасибо за вечеринку! Установил всю сборку, все работает. Великолепно

  • @Dedinside05
    @Dedinside05 Год назад +11

    Теперь нужна вёрстка с это сборкой с подключением всяких слайдеров и тд чтоб стало ясно)

    • @vadymprokopchuk
      @vadymprokopchuk  Год назад +7

      да да да, согласен

    • @sergeevalexander4695
      @sergeevalexander4695 10 месяцев назад

      Согласен,нужно чтобы Вадим что-то сверстал на этой сборке,а то есть вопросы как начинаеться верстка.

  • @ksoar8994
    @ksoar8994 9 месяцев назад +7

    У кого не работает или неправильно работает avif, webp, imagemin: поставьте версию gulp как у автора в package.json и запустите заново npm i

    • @SandyWinman
      @SandyWinman 9 месяцев назад

      Привет. А как поставить (можете скинуть)? А то я зеленый и только пытаюсь въехать в галп, повторяя за Вадимом, но на всё выдается такая ошибка: Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\Слава\Desktop\Frontend\gulp-start
      ode_modules\gulp-webp\index.js from C:\Users\Слава\Desktop\Frontend\gulp-start\gulpfile.js not supported.
      Instead change the require of index.js in C:\Users\Слава\Desktop\Frontend\gulp-start\gulpfile.js to a dynamic import() which is available
      in all CommonJS modules.
      at Object. (C:\Users\Слава\Desktop\Frontend\gulp-start\gulpfile.js:11:14) {
      code: 'ERR_REQUIRE_ESM'
      }
      Заранее спасибо!

    • @ksoar8994
      @ksoar8994 9 месяцев назад +2

      @@SandyWinman у тебя webp бунтует, просто в файле package.json найди webp и измени цифры его версии на те что у Вадима, а после набери команду npm i, чтобы эта версия загрузилась. Рекомендую все плагины ставить с такой же версией как на видео, чтобы проблем не было

    • @neumannsauer
      @neumannsauer 5 месяцев назад

      @@ksoar8994 я версии всех плагинов точь в точь переписал как у автора. и удалил папку npm_modules с pacakge-lock.json. потом в консоли заново написал npm i. такая ошибка выходит:
      42 vulnerabilities (14 moderate, 28 high)
      на это все равно? или написать npm audit fix --force?

    • @Артем-з9щ1е
      @Артем-з9щ1е Месяц назад

      Если бы я раньше нашёл этот коммент😂😂 так два дня сам тупил сидел, пока версии не поставил те что у Вадима 😅 и все заработало

  • @АлександрФомичев-п6ъ

    Очень ждал продолжения)

  • @bergghest
    @bergghest 8 месяцев назад

    Сборка просто топчик! Спасибо!

  • @htywyj
    @htywyj Год назад +1

    Єеее боооой!
    Вадос зробив потужний відос!

  • @vaqiffatiyev585
    @vaqiffatiyev585 Год назад

    Очень понятно, интересно, доступно!!!! Спасибо тебе!

  • @DrKrInfinity
    @DrKrInfinity Год назад

    Спасибо большое за сборку!

  • @dimasnytin
    @dimasnytin Год назад +1

    Божественно ❤

  • @AlFino1337
    @AlFino1337 Год назад +3

    Вадим , спасибо огромное за сборку, требую добавление вебпака в нашу сборочку.

  • @j-lewis
    @j-lewis Год назад

    офигенно) Спасибо большое, дождался!))

  • @cyberactiv1
    @cyberactiv1 Год назад +1

    шедеврально !!!🙂

  • @gerasymenko1
    @gerasymenko1 Год назад +1

    Волшебно

  • @Creative_duck
    @Creative_duck Год назад

    Просто Супер. Спасибо !

  • @petrpetrovich-sg2jj
    @petrpetrovich-sg2jj Год назад

    как же долго этого ждал)))

  • @spr1ng586
    @spr1ng586 Год назад +1

    Только несколько дней назад решил сделать проект на твоей сборке, и всё время не доходили руки посмотреть видео по неë, кажется это видео мой шанс

    • @vadymprokopchuk
      @vadymprokopchuk  Год назад

      это продолжение, если все пройдешь будет оч полезно

  • @Норик-п8щ
    @Норик-п8щ Год назад +1

    Супер годная вечеринка подъехала ❤👍👍

  • @RomanKhassazhirov
    @RomanKhassazhirov Год назад

    Спасибо, за то что услышал наш молитвы и выпустил эту годноту! :3

  • @newgen8136
    @newgen8136 Год назад

    Спасибо большое за вашу работу

  • @anna_4088
    @anna_4088 Год назад +17

    Вадим, планируете сделать такие же уроки только с WebPack? Мы очень ждем 🥰🥺

  • @VadymShtyra
    @VadymShtyra Год назад

    Шедеврально

  • @Freedom_Code
    @Freedom_Code 5 месяцев назад

    Спасибо, даже без апгрейдов, офигенная сборка, есть только вот 2024 июля поправочка, автопрефиксер не юзается через require, если устанавливать не версию из видео. Переделал сборку на mjs , завелось.
    Кайфую, офигенная вечериночка, спасибо !!!

  • @nicefellow7929
    @nicefellow7929 Год назад

    Как всегда годный контент с отличной подачей!👍

  • @ak-id9ir
    @ak-id9ir Год назад +1

    Мужик реальный

  • @augustina1981
    @augustina1981 9 месяцев назад

    Отличная сборка! Первая, которая запускается и работает!

  • @ob5804
    @ob5804 Год назад

    Так давно Вас не було( Дякую)

    • @vadymprokopchuk
      @vadymprokopchuk  Год назад +2

      я тут, все добре, будь ласка, рухаємося далі

  • @user-rz1234
    @user-rz1234 Год назад +1

    Шедеврально) по ходу появился вопрос зачем вообще нужны svg спрайт, гугл конечно помог, но хотелось бы пару комментариев, или как то дальше показать когда ты используешь

  • @StanislavPatlakha
    @StanislavPatlakha Год назад

    Спасибо за труд.)

  • @kseniatokar4847
    @kseniatokar4847 Год назад +6

    Starting 'images'...
    [22:51:54] 'images' errored after 69 ms
    [22:51:54] Error in plugin "gulp-avif"
    Message:
    .webp not supported
    Details:
    domainEmitter: [object Object]
    domainThrown: false
    подскажите, как решить?

    • @MarkSizm-de5on
      @MarkSizm-de5on 11 месяцев назад

      Тоже самое, у вас получилось решить?

    • @vurgunkafarzada3008
      @vurgunkafarzada3008 7 месяцев назад

      src(['....'], {encoding: false})

    • @ВасилийАнисимов-ш1ц
      @ВасилийАнисимов-ш1ц 7 месяцев назад

      @@MarkSizm-de5on тоже такая проблема . Решили эту проблему?

    • @ВасилийАнисимов-ш1ц
      @ВасилийАнисимов-ш1ц 7 месяцев назад

      Как вы решили эту проблему?

    • @АнтонЛеов
      @АнтонЛеов 7 месяцев назад

      Просто переустановите gulp на версию ниже чем 5, удалив перед этим текущую версию командой: npm rm gulp, затем установить заново: npm i gulp@4.0.2 -D должно заработать

  • @khrustetsky
    @khrustetsky Год назад +3

    Сверстай какой-то лендос на этом всем деле будет интересно и думаю полезно посмотреть на это все в деле

  • @sychpetr8394
    @sychpetr8394 Год назад

    Вадим спасибо за твой труд. +++

  • @Nikolay_shavar
    @Nikolay_shavar Год назад

    шедеврально

  • @jurkochervony4056
    @jurkochervony4056 Год назад +5

    Якщо в когось не конфертуються шрифти або зберігає не в ту папку - то варто встановити "gulp-fonter-unx", оскільки "gulp-fonter" написаний під вінду.
    Я пару годин шукав чому ж конвертація шрифтів некоректно працює.

  • @SY-im1bn
    @SY-im1bn Год назад

    лучший, спасибо тебе! дай бог здоровья !
    хотелось бы еще js кода в верстках.

  • @Диман-е9ш
    @Диман-е9ш Год назад +1

    Спасибо, в дальнейшем по webpack хотелось бы увидеть видео.

  • @ermolaev_design
    @ermolaev_design Год назад +16

    Если ваша вечеринка не похожа на это, даже не пытайтесь меня приглашать

  • @othersidesss1
    @othersidesss1 Год назад

    Красавчик !!

  • @anidesko
    @anidesko Год назад +20

    Было бы замечательно увидеть верстку с применением этой сборки😏

    • @makcmakc963
      @makcmakc963 Год назад +1

      Всеми конечностями ЗА...

  • @igorjazz4544
    @igorjazz4544 Год назад +4

    Дякую. Хотелось бы небольшой проект на 3-4 страницы, так что бы компонентно, с gulp, на препроцессоре , с сохранением и работой на Git Hub, а потом натянуьть на wordpress. И вопрос, бывает вообще подходы в верстке когда у тебя верстка изначально максимально гибкая и адаптивная, то есть что бы при адаптиве максимально мало тратить времени?

  • @Johnny29180
    @Johnny29180 5 месяцев назад +1

    вы обещали в первом видео,показать как объединять несколько джс файлов в один и так и не показали( хотелось бы увидеть

  • @СергейБабанов-г7и
    @СергейБабанов-г7и 7 часов назад

    Вадим в этой сборке почему-то нет примера подключения шрифтов в файле style.scss , ты говорил чтобы мы комментировали то, чего нам не хватает. Вот этого явно не хватает.

  • @littlecat8445
    @littlecat8445 Год назад

    Большое спасибо🌺🌺🌺

  • @ЕвгенийСоболевский-л6л

    Добрый вечер, я 3-й в комментах с такой проблемой ! Исправлена ли она на патреоне? Формат woff через fonter не конвертируется? выдает Read woff error on OpenSans-Bold.woff - Will just copy file... За сборку спасибо.

    • @dindin5528
      @dindin5528 Год назад

      Решил проблему?

    • @ЕвгенийСоболевский-л6л
      @ЕвгенийСоболевский-л6л Год назад

      @@dindin5528 нет не решил, мне пока усечённого сборщика хватит, а уж дальше буду развиваться. Полагаю это не готовый продукт, его задача привлечь внимание к курсам. Но, все равно, автору спасибо.

  • @man_money_
    @man_money_ Год назад

    Дуже дякую за урок!

  • @cars_owners
    @cars_owners Год назад +1

    Дайте ссылку на ролик, где верстаем на данной сборке. Либо, пожалуйста, запишите пример верстки используя данную сборку

  • @max_plovchik4916
    @max_plovchik4916 Год назад

    Шедварительно

  • @Shved_2.0
    @Shved_2.0 Год назад

    просто грузовик лайков(больше одного нельзя)!!!
    Ну во-первых, большое тебе спасибо,
    Во-вторых , огромное тебе спасибо.
    Ты не только профессионал. но и большой молодец👍

  • @СашаМартен
    @СашаМартен Год назад

    Гений, молодец 👍👌

  • @КоляСолдат
    @КоляСолдат 6 месяцев назад

    Спасибо, познавательно. Будет ли подобный гайд для "vite" ? Нынче тоже набирает популярность, особенно в laravel+vue.js

  • @vadok111
    @vadok111 Год назад

    Папка stack переносится потому что в building идёт сбор html файлов по всем папкам в папке app, а должен идти только по папке app 😉

  • @9cross9plays38
    @9cross9plays38 Год назад +1

    А что делать если в шрифтах всё конвертируется, кроме файлов .woff? При попытке конвертнуть .woff в консоли просто пишет "Read woff error on Roboto-Black.woff - Will just copy file" и просто переносит его в папку fonts, а формата .woff2 этого шрифта не появляется

  • @serhiodev
    @serhiodev Год назад

    Крутая сборка))) Кстати проблему с выгрузкой папки stack решил путем выставления свойства example в значение false (example: false) в таске sprite()

    • @vadymprokopchuk
      @vadymprokopchuk  Год назад

      та тогда файл не будет создаваться, наша проблема в том что в билде написано перенесить все html файли в не зависимости от того где находятся

  • @АленкаФ-е7о
    @АленкаФ-е7о 2 месяца назад

    Gulp стал выбивать ошибку: Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0. Что делать? Помогитеее

  • @HaivoX
    @HaivoX Год назад +1

    А что делать со спрайтом свг-шным, и в скомпелированой сборке, картинки на странице не отображаться.

  • @ЕгорЕгорович-д2т

    Топчик

  • @amir-yuldashev7199
    @amir-yuldashev7199 Год назад

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

  • @user-soda-adept
    @user-soda-adept 5 месяцев назад +1

    коментар з 2024 року - gulp-avif з часу запису відео не оновлювався, і не працює з gulp 5(як вирішується не знайшов), тому або gulp 4, або обійтися поки без avif. також в gulp 5 для копіювання і оптимізації графіки треба дописувати {encoding: false}, інакше картинки в dist будуть биті

    • @Freedom_Code
      @Freedom_Code 4 месяца назад

      Ля, спасибо тебе, верстал по сборке и тут хобана, приехал

    • @Freedom_Code
      @Freedom_Code 4 месяца назад

      А у тебя нет будет примера ,че поправить, уже 3 часа долбашусь, картинки битые получаются

    • @user-soda-adept
      @user-soda-adept 4 месяца назад

      @@Freedom_Code тобі треба просто встановити gulp 4 і можливо понизити версії плагінів, що картинки обробляють.
      Можеш спробувати також encode: false прописати не знижуючи версію галпа, може получиться. Приклад або пошукай на стаковерфлоу або я пізніше напишу, коли буду за пк

  • @Даничка-г2и
    @Даничка-г2и Год назад

    не опять А СНОВА!! :)

  • @God-zy9wc
    @God-zy9wc Год назад +2

    Спасибо за труды, лучший ^^
    Проблема при конвертации .woff
    В документашке пишут:
    "
    woff files
    Currently fonteditor-core is having some problems with woff files as source. Please not use woff files as source if You no need to.
    "
    так что если у вас не работает конвертация .woff, то не удивляйтесь.
    P.s. С .woff2 и .ttf работает как надо.

    • @dindin5528
      @dindin5528 Год назад

      решил проблему с woff?

  • @mezuzuplay6099
    @mezuzuplay6099 Год назад +1

    чому ти не робив збірку під ES 6 модулі, вони ж не підтримують require

  • @candy_front
    @candy_front 11 месяцев назад

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

  • @skyskyblue9508
    @skyskyblue9508 Год назад

    Спасибо!

  • @Ai_vengo
    @Ai_vengo Год назад

    Вадим подскажи пожалуйста, когда убираю куски кода в header и footer как на 1:07:31, то Vs code ругается желтым, мол ошибки в коде, т.к. на каждой странице он как бы не завершен. У тебя же такого нет на видео. Как сделать чтобы этого не было?)

  • @makcmakc963
    @makcmakc963 Год назад +1

    Приветствую всех и в особенности Автора канала
    У меня почему то файлы woff не конвертирует в woff2 , а просто переносит оригинал файла.woff в папку fonts
    Не пойму что не так, может кто подскажет или сталкивался с подобным?

  • @Ivanfwit
    @Ivanfwit Год назад +2

    как уже писали в комментариях столкнулся с парой проблем, если кто знает как решить, буду очень благодарен 1) при конвертации шрифтов не сохраняет как надо, например в return src('app/fonts/src/*.*') лежит test-otf.otf, а он выкидывает с названием сразу "src\test-otf.woff2" и просто в папку app вместо пути указанного в функции .pipe(dest('app/fonts')) 2) проблема в том что woff не конвертирует в woff2, просто дублируется woff где и должен быть в fonts. Буду очень благодарен если это помогут решить, т.к. повторяю все по шагам и уже кучу раз сверил что может быть не так с видео...
    upd: сказали, что со сборкой все норм, что-то не так или с шрифтами или с настройками системы.. спасибо большое за видео!

    • @МаринаНатальина-у6ц
      @МаринаНатальина-у6ц Год назад

      у меня та же проблема. как вы решили ее?

    • @Ivanfwit
      @Ivanfwit Год назад +1

      @@МаринаНатальина-у6ц не решил, забил на конвертацию шрифтов

    • @МаринаНатальина-у6ц
      @МаринаНатальина-у6ц Год назад +4

      @@Ivanfwit нашла ответ. оказалось на данный момент у плагина gulp-fonter проблемы с форматом woff. Они просят не использовать этот формат

    • @Ivanfwit
      @Ivanfwit Год назад

      @@МаринаНатальина-у6ц спасибо!

    • @MarkSizm-de5on
      @MarkSizm-de5on 11 месяцев назад

      @@МаринаНатальина-у6ц спасибо!!!

  • @ДмитрийКвирас
    @ДмитрийКвирас Год назад

    Ура🎉🎉🎉

  • @gerasymenko1
    @gerasymenko1 Год назад

    Сэнсей, нужно взять катану и бахнуть по этой сборке марафон по вёрстке!!!!!!!!!!!!!

  • @sad_gary
    @sad_gary Год назад +1

    avif не хочет работать, все по видео записал, но не в какую
    12:19:53] Starting 'images'...
    [12:19:53] 'images' errored after 33 ms
    [12:19:53] Error in plugin "gulp-avif"
    Message:
    Input buffer contains unsupported image format
    Details:
    domainEmitter: [object Object]
    domainThrown: false

    • @gorer-u6p
      @gorer-u6p 8 месяцев назад +1

      Привет, аналогичная ситуация,вышло как-то решить?

    • @ВасилийАнисимов-ш1ц
      @ВасилийАнисимов-ш1ц 7 месяцев назад

      Получилось решить проблему и как?

  • @natanrock4358
    @natanrock4358 Год назад

    спасибо тебе огромное

  • @SergiyPolar
    @SergiyPolar Год назад +2

    Совершенно необходимо добавить функцию при которой закидываешь файл дизайна из фигмы, нажимаешь кнопку и на выходе сразу получаешь деньги, менуя моменты вёрстки и лишнего общения с клиентом 😂😂😂

  • @dimondimonov6417
    @dimondimonov6417 Год назад

    Я уже подготовил коньячок с кофем для просмотра)))

  • @Алексей-ж4з8и
    @Алексей-ж4з8и Год назад +2

    Привет. Заметил одну интересную особенность: если при верстке в SCSS-файле закомментировать строку, сборщик ломается.
    Starting 'styles'...
    [20:56:09] 'styles' errored after 99 ms
    [20:56:09] CssSyntaxError in plugin "gulp-autoprefixer"
    D:\WORK
    ewProj\app\scss\style.scss:153:6: Unknown word
    You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser 151 |
    152 | .actBtn {
    > 153 | // width: 25rem;
    | ^
    154 | // height: 6rem;
    Details:
    reason: Unknown word
    -------------------------------
    ...и еще: только у меня не работают CSS-сниппеты при верстке? В скоупе сниппетов указан и CSS, и SCSS.
    HTML-сниппеты работают.

  • @Monte546-s1w
    @Monte546-s1w Год назад +3

    Вышел новый сборщик Vite будет ли на него обзор?

    • @alext5030
      @alext5030 Год назад

      Vite - это просто быстрый webpack. Конфигурируется немного проще. Вот и все.

    • @j-lewis
      @j-lewis Год назад

      А смысл? Изучать Vite и делать сборку на нём, чтобы потом прийти в любую контору и пересесть за Webpack? Вот когда станет (если станет) популярным, тогда можно переходить, а пока это так, трендовые понты, только и всего. IMHO

    • @alext5030
      @alext5030 Год назад

      @@j-lewis Согласен. Только если интересно для себя и времени свободного вагон.
      Да и вообще, бандлеры типа Webpack или Vite заточены, в первую очередь, для SPA. Пытаться сделать из козы овцу - это такое... Но можно интегрировать в галп для обработки всего, что связано с JS-ом.
      Я, правда, для этой цели Rollup заюзал (не реклама, не рекомендация).

  • @ob5804
    @ob5804 11 месяцев назад +1

    Допоможіть, будь ласка
    Птання. Як зробити. щоб папка stack зявлялась в папці app/images???? Окремо запускаю таск images, потім sprite, і building і все ок, картинки конвертуються, папка stack, файл sprite.svg створюються і в dist все правильно, але коли запускаю повністю збірку gulp, то в папці app.images картинки конвертуються, sprite.svg файла нема і папки stack нема, але в dist sprite.svg файл є і папка stack не перенеслась)
    function building() {
    return src([
    'app/css/style.min.css',
    '!app/images/**/*.html',
    'app/images/*.*',
    '!app/images/*.svg',
    'app/images/sprite.svg',
    'app/fonts/*.*',
    'app/js/main.min.js',
    'app/*.html',
    ], { base: 'app' })
    .pipe(dest('dist'))
    }
    exports.styles = styles;
    exports.images = images;
    exports.fonts = fonts;
    exports.building = building;
    exports.sprite = sprite;
    exports.scripts = scripts;
    exports.watching = watching;
    exports.build = series(cleanDist, building);
    exports.default = parallel(styles, images, scripts, watching);

  • @MrVitiok20091
    @MrVitiok20091 7 месяцев назад

    Підкажіть, будь ласка, як в Prettier вимкнути автозакривання тегів? Не можу поєднати header і footer. Воно закриває header з body в header'i, а потрібно закрити body в footer...

  • @СергейТрубников-ж6ч
    @СергейТрубников-ж6ч 10 месяцев назад

    Дякую за твою працю!

  • @СергейЛупу-т1с
    @СергейЛупу-т1с Год назад

    супер 👍

  • @Артем-з9щ1е
    @Артем-з9щ1е Месяц назад

    Здаров Вадос, спасибо за сборку, все что ты делаешь для нас это круто, я просто кайфую. Вчера повторял все за тобой, но почему то не работает autoprefixer, закоментировал константу и строчку в функции все остальное снова работает, голову сломал не пойму что за ф-я. Мб префиксер уже не актуален

  • @Angel_Zii
    @Angel_Zii Год назад +1

    Спасибо, вечеринка супер. Но есть одно - НО. Страница не обновляется автоматически. Да, файл индекс в арр обновляется , а сам браузер нет

  • @plaguemoon
    @plaguemoon Месяц назад

    Дякую за відеоурок! У кого виникають проблеми зі зображеннями, встановіть такі самі версії gulp, gulp-webp, gulp-imagemin як у автора

    • @Наталья-р4д3ь
      @Наталья-р4д3ь Месяц назад

      doesn't work anyway. Do you have more ideas how to fix it? the same shit with sprite and fonts.

  • @ДмитрийОрлов-б3р

    Подскажите, при использовании плагина gulp-include в терминале(в problems) появляются ошибки.... мол, нельзя использовать в файле header.html незакрытый тэг body.. Как можно исправить??