#5 Gulp сборка проекта | assets, images, svg-sprite

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

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

  • @Фронтендер-з6о
    @Фронтендер-з6о  3 года назад +2

    Таймкоды:
    0:00​ Интро
    0:14​ Таск assets
    1:02​ Перенос шрифтов
    2:24​ Перенос видео
    3:40​ Перенос изображений
    6:25​ gulp-debug
    7:14​ gulp lastRun
    9:36​ gulp-changed
    12:15​ Оптимизация изображений
    14:07​ imagemin-pngquant
    17:03​ Перевод изображений в webp
    19:45​ Настройка svg спрайтов
    24:39​ Оптимизация svg через svgo
    27:28​ Как стилизовать svg в спрайте

  • @ИринаГончарова-м8к
    @ИринаГончарова-м8к 3 года назад +3

    Крутой и информативный урок!

  • @YulianUshanskyi
    @YulianUshanskyi 3 года назад +1

    Спасибо за видео ))

  • @dkyshka2436
    @dkyshka2436 3 года назад +3

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

  • @mirrror7152
    @mirrror7152 3 года назад +4

    Спасибо

  • @oleksandr2932
    @oleksandr2932 2 года назад +1

    Подскажите пожалуйста, почему в стрелочных функциях такие скобки (), а не {}? 12:30

    • @Фронтендер-з6о
      @Фронтендер-з6о  2 года назад +2

      Привет!
      Можно было и без () таких скобок написать. Когда после стрелочной функции идет выражение, например
      const fn = () => 'my string'
      или
      const fn =() => anotherFn()
      Это значит, что функция fn вернет то, что находится после =>
      Так просто быстрее писать, чем
      const fn = () => {
      return 'my string'
      }
      learn.javascript.ru/arrow-functions-basics

  • @YulianUshanskyi
    @YulianUshanskyi 3 года назад +1

    gulp-imagemin с 8 версией проблема появилась откатил ^7.1.0 заработало ну вопрос : с 8 версией уже не будет работать?

    • @Фронтендер-з6о
      @Фронтендер-з6о  3 года назад

      Привет!
      Инструменты слишком быстро обновляются, к сожалению, сам не знаю, нужно тестировать

  • @Shakhrom-b7d
    @Shakhrom-b7d 3 года назад +1

    почему-то при параметрах качества сжатия png [ 0.8, 0.9 ] нет сжатия, поменял на [ 0.75, 0.9 ] и всё заработало.

    • @Фронтендер-з6о
      @Фронтендер-з6о  3 года назад

      Привет!
      Может изображение уже было сжато? Можно попробовать с другими изображениями, так как у меня работает с этими параметрами. Но эти параметры всегда можно подстроить под себя.

  • @xOceanSpirit
    @xOceanSpirit 3 года назад

    Привет. Скачал по ссылке под видео с гита архив, использовал команду "npm i gulp-changed gulp-imagemin imagemin-webp imagemin-pngquant gulp-svg-sprite --save-dev"
    При запуске gulp imagesWatch пишет "Task never defined: imagesWatch". Не подскажешь в чем проблема?

    • @Фронтендер-з6о
      @Фронтендер-з6о  3 года назад

      Привет!
      Пишет что нету команду imagesWatch
      Посмотри в файле есть только build и watch
      github.com/DmitryBerdnikov/gulp-frontend-start-project/blob/lesson5/gulpfile.babel.js

  • @ГеннадийКалинин-т4ш

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

    • @Фронтендер-з6о
      @Фронтендер-з6о  3 года назад

      Привет!
      Пробовал скачать сборку с гитхаба? Надо протестировать, есть ли эта проблема

    • @ГеннадийКалинин-т4ш
      @ГеннадийКалинин-т4ш 3 года назад

      Доброе утро:) спасибо что ответил:) не, я взял сборку у одного из обзорщиков, как я понял, данная проблема довольно таки редкая. возможно виной тому мой старенький ноут. я узнал что такая проблема была в других версях imegmin но только с SVG форматом.

    • @ГеннадийКалинин-т4ш
      @ГеннадийКалинин-т4ш 3 года назад

      @@Фронтендер-з6о вот только не могу понять как откатить или установить определённую версию.

    • @Фронтендер-з6о
      @Фронтендер-з6о  3 года назад

      @@ГеннадийКалинин-т4ш
      Может поможет
      Как установить конкретную версию
      dev-gang.ru/article/npm-ustanovka-opredelennoi-versii-paketa-o9yeyu38qz/
      Версии imagemin
      www.npmjs.com/package/imagemin
      Например
      npm install imagemin@7.0.1

    • @ГеннадийКалинин-т4ш
      @ГеннадийКалинин-т4ш 3 года назад

      @@Фронтендер-з6о не помогло :( перебрал все версии