Не совсем понятно, что вы подразумеваете под режимом watch. Хотя, это неважно. Этот режим не подразумевает сохранения чего бы-то не было. Режим watch предназначен для наблюдения за изменениями. После режима наблюдения вы запускаете режим development или production. Именно эти режимы сохраняют сборку в файлы.
Небольшое уточнение. Собственный режим watch в вебпаке отличается от режима watch девсервера тем, что при каждом изменении, в первом случае, браузер нужно перезапускать вручную, а во втором, девсервер перезагружает страницу браузера автоматически.
Если вы внимательно читали, то сжатие производит не вебпак, а минификатор imagemin, точнее плагины к нему. Сжатие может быть без потерь качества и с потерями. Все зависит от того, какие установлены плагины и как они настроены. Без потерь качества файлы сжимаются хорошо, если они до этого не подвергались сжатию. С потерями вы можете сжимать сколько душе угодно.
Эта сборка настроена на работу с Pug и SCSS. Но если вы используете html и css, то вам нужно html разметку писать в файлах pug, а стили css в файлах scss. Либо настроить сборку под свои инструменты.
Мне не приходилось совмещать Gulp и Webpack. Есть сомнения в таком симбиозе, хотя, возможно, я чего-то не понимаю. Насчет необходимости тех или иных функций, это решать вам.
Встроенные ассеты работают с файлами как с модулями, например, файл прописан в коде с помощью import/require() и расположен в некоем каталоге. Задача ассетов отправить этот файл либо в выходной каталог, либо встроить в код и соответствующим образом преобразовать import/require() в URL-адрес, по которому браузер найдет этот ресурс.
Файловый менеджер работает не с файлами-модулями, а с обычными файлами, которые нигде не прописаны в коде, но эти файлы необходимы на работающем сайте. Конечная цель сборщика создать полностью готовую сборку, которая должна будет без каких-либо доработок напильником залита на рабочий сервер.
Что касается замедления разработки, то, по-моему, ассеты замедляют разработку куда больше, чем файловый менеджер, который влияет только на скорость начального запуска сервера разработки. Но это решаемо. Если в режиме разработки вы очень долго ожидаете загрузку, то для режима разработки можно создать отдельный конфиг для вебпака, в котором можно исключить файловый менеджер.
Возможно, я в чем-то не прав, тогда пусть меня поправят спецы, которые лучше разбирается в этой теме.
Будем считать, что это не уровень читателя, а уровень автора. И я не сомневаюсь, что все читатели будут намного выше этого уровня. Гораздо хуже бывает, когда руководство написано для одного уровня, а чтобы в нём разобраться нужно быть подкованным на несколько уровней выше.
Дело не сколько в нашем желании, а в той действительности, в которой мы существуем. И эта действительность нам ставит не только задачи, но и дает ограниченный набор инструментов для решения этих задач. Что с того, что существует такой прекрасный инструмент как электромолоток. Да, он есть, производительность его огромная, но вы приходите на работу и вам дают обычный молоток. И вам придется научится им пользоваться.
Что касаемо того, что умеет или не умеет vite, я не знаю. Где то читал, что он не поддерживает устаревшие браузеры.
Я согласен лишь с тем, что vite - это инструмент нового поколения. Однако, огромное количество проектов разрабатывается на webpack. Большинство вакансий требуют знаний webpack. Поэтому, данный сборщик еще очень долго будет актуальным. Посмотрите на jquery. Несмотря на абсолютное доминирование таких инструментов, как React, Vue и т.п., библиотека jquery до сих пор используется на огромном количестве сайтов. А на рынке труда не так редко попадаются вакансии с требованием jquery. Так что, знание и умение работать с вебпаком лишним не будет.
Не совсем понятно, что вы подразумеваете под режимом watch. Хотя, это неважно. Этот режим не подразумевает сохранения чего бы-то не было. Режим watch предназначен для наблюдения за изменениями. После режима наблюдения вы запускаете режим development или production. Именно эти режимы сохраняют сборку в файлы.
Небольшое уточнение. Собственный режим watch в вебпаке отличается от режима watch девсервера тем, что при каждом изменении, в первом случае, браузер нужно перезапускать вручную, а во втором, девсервер перезагружает страницу браузера автоматически.
Если вы внимательно читали, то сжатие производит не вебпак, а минификатор imagemin, точнее плагины к нему. Сжатие может быть без потерь качества и с потерями. Все зависит от того, какие установлены плагины и как они настроены. Без потерь качества файлы сжимаются хорошо, если они до этого не подвергались сжатию. С потерями вы можете сжимать сколько душе угодно.
Очень мало данных для того, чтобы делать какие-то выводы.
Эта сборка настроена на работу с Pug и SCSS. Но если вы используете html и css, то вам нужно html разметку писать в файлах pug, а стили css в файлах scss. Либо настроить сборку под свои инструменты.
Мне не приходилось совмещать Gulp и Webpack. Есть сомнения в таком симбиозе, хотя, возможно, я чего-то не понимаю. Насчет необходимости тех или иных функций, это решать вам.
Встроенные ассеты работают с файлами как с модулями, например, файл прописан в коде с помощью import/require() и расположен в некоем каталоге. Задача ассетов отправить этот файл либо в выходной каталог, либо встроить в код и соответствующим образом преобразовать import/require() в URL-адрес, по которому браузер найдет этот ресурс.
Файловый менеджер работает не с файлами-модулями, а с обычными файлами, которые нигде не прописаны в коде, но эти файлы необходимы на работающем сайте. Конечная цель сборщика создать полностью готовую сборку, которая должна будет без каких-либо доработок напильником залита на рабочий сервер.
Что касается замедления разработки, то, по-моему, ассеты замедляют разработку куда больше, чем файловый менеджер, который влияет только на скорость начального запуска сервера разработки. Но это решаемо. Если в режиме разработки вы очень долго ожидаете загрузку, то для режима разработки можно создать отдельный конфиг для вебпака, в котором можно исключить файловый менеджер.
Возможно, я в чем-то не прав, тогда пусть меня поправят спецы, которые лучше разбирается в этой теме.
Будем считать, что это не уровень читателя, а уровень автора. И я не сомневаюсь, что все читатели будут намного выше этого уровня. Гораздо хуже бывает, когда руководство написано для одного уровня, а чтобы в нём разобраться нужно быть подкованным на несколько уровней выше.
Дело не сколько в нашем желании, а в той действительности, в которой мы существуем. И эта действительность нам ставит не только задачи, но и дает ограниченный набор инструментов для решения этих задач. Что с того, что существует такой прекрасный инструмент как электромолоток. Да, он есть, производительность его огромная, но вы приходите на работу и вам дают обычный молоток. И вам придется научится им пользоваться.
Что касаемо того, что умеет или не умеет vite, я не знаю. Где то читал, что он не поддерживает устаревшие браузеры.
Я согласен лишь с тем, что vite - это инструмент нового поколения. Однако, огромное количество проектов разрабатывается на webpack. Большинство вакансий требуют знаний webpack. Поэтому, данный сборщик еще очень долго будет актуальным. Посмотрите на jquery. Несмотря на абсолютное доминирование таких инструментов, как React, Vue и т.п., библиотека jquery до сих пор используется на огромном количестве сайтов. А на рынке труда не так редко попадаются вакансии с требованием jquery. Так что, знание и умение работать с вебпаком лишним не будет.
Да, подойдет. Впрочем, я добавил в это руководство главу Установка и настройка React
Собственно, для этой цели статья и написана. Если выполнять всё по порядку, то настроите рабочую сборку вебпак. Старался ничего не пропустить.
Спасибо, исправил.