Webpack. Full Course 2020

  Переглядів 620,872

Владилен Минин

Владилен Минин

День тому

Webpack. Full Course 2020
After this video you will learn how to create builds for any projects.
Why course is almost 3 hours? I will tell you about everything in details: babel, typescript, eslint, sass, less, react jsx, hmr, dev server, fonts, images, xml, csv. I will tell you about app optimization with different builds, resolving issue with cache, configuring Webpack for different environments, bundle analyze and best practices
After this video you will no longer have any questions about how frontend is working
Telegram: teleg.one/js_by_vladilen
Instagram: / vladilen.minin
VK: vladilen.minin
Udemy Angular 9:
clc.to/angular
Udemy React Native:
clc.to/rnative
Udemy ReactJS:
clc.to/react
Source code in telegram channel:
teleg.one/js_by_vladilen
Support new videos:
Yandex Money: money.yandex.ru/to/4100137576...
PayPal: www.paypal.me/vladilenm
Webpack. Full Course 2020
#webpack #js #javascript

КОМЕНТАРІ: 1 600
@VladilenMinin
@VladilenMinin Рік тому
Исходники тут: t.me/js_by_vladilen/125 Эксклюзивный контент на моем Boosty: boosty.to/vladilen
@sepulz
@sepulz Рік тому
Лучший гайд!!! Ждём обновления под версию 5.
@VladilenMinin
@VladilenMinin 4 роки тому
Долго выбирал материал для этого ролика и постарался в нем учесть все ваши пожелания :) Приятного обучения и просмотра!
@andriikostenko2379
@andriikostenko2379 4 роки тому
Большое спасибо за курс! То, что сейчас нужно.
@user-jp5zq8it9j
@user-jp5zq8it9j 4 роки тому
Владилен, огромное спасибо!!! А вы могли бы добавить таймкоды?
@FDenni
@FDenni 4 роки тому
Большое спасибо! Надеюсь всё же дождусь курс от тебя по NgRx и ещё что-нибудь по Angular)))
@user-lb9kz8wb7h
@user-lb9kz8wb7h 4 роки тому
как обычно, красавчик просто) спасибо огромное). Лайк поставил, к просмотру позже, не успеваю за твоим контентом)
@FDenni
@FDenni 4 роки тому
@@user-fx3of4zx6s Спасибо! Сейчас гляну)
@AugusteEden
@AugusteEden 3 роки тому
У кого возникает проблема с CopyWebpackPlugin - там теперь в plugins нужно писать немного иначе: new CopyWebpackPlugin({ patterns: [ { from: path.resolve(__dirname, 'src/favicon.ico'), to: path.resolve(__dirname, 'dist') } ] })
@darklightning2624
@darklightning2624 3 роки тому
Спасибо тебе, добрый человек
@technobydlo6093
@technobydlo6093 3 роки тому
Как же подгорает от вебпак мира! Не успел добраться до годного курса, как уже что-то в синтаксисе поменялось.
@kostasancez2358
@kostasancez2358 3 роки тому
@@technobydlo6093 по этому документация лучше любых курсов
@vanunsakanyan2188
@vanunsakanyan2188 3 роки тому
спосибо
@annagardt2360
@annagardt2360 3 роки тому
Спасибо! Ваш комментарий очень помог!
@user-ph1vu6ou6c
@user-ph1vu6ou6c 2 роки тому
Проблема с дублированием файлов (png, fonts). Вместо use: 'file-loader' используйте type: 'asset/resource' - это нововведение (относительное) Webpack, которое помогает избежать данной ошибки. Подробнее можно узнать в документации Webpack в разделе asset-modules, там все кристально объяснено.
@user-gu2lf6tr8m
@user-gu2lf6tr8m 2 роки тому
по делу коммент, помог
@nikitakhilioti
@nikitakhilioti 2 роки тому
Супер, спасибо помог!
@user-gc2ez7zb1f
@user-gc2ez7zb1f 2 роки тому
Святой человек, помог!
@strange_man317
@strange_man317 2 роки тому
@@user-gc2ez7zb1f На небе есть отдельное облако для тех, кто кидает годноту в комментах)))
@user-gc2ez7zb1f
@user-gc2ez7zb1f 2 роки тому
@@strange_man317 места рядом с типами со стек оверфлоу
@Elzar1993
@Elzar1993 4 роки тому
Спасибо большое, Владилен, за бесплатный супер контент по вебпаку. Ты делаешь мир IT лучше! респект!
@marinagrishina4369
@marinagrishina4369 3 роки тому
в Webpack 5 теперь нужно немного поправить devtool - вместо пустых кавычек '' подставить false devtool: isDev ? 'source-map' : false
@user-kv5xf8qw7f
@user-kv5xf8qw7f 3 роки тому
Спасибо!
@nikitakhilioti
@nikitakhilioti 2 роки тому
Спасибо, помогло!!
@andrewizosimov2726
@andrewizosimov2726 2 роки тому
Спасибо большое, мне помогло!))
@eGusevWeb
@eGusevWeb 3 роки тому
Когда шёл на UKposts за обучалками по Webpack - прямо таки молился, чтоб у Владилена Минина был такой контент ) пушка! Спасибо!
@kotovadana
@kotovadana 4 роки тому
Спасибо огромное за видео! Повторяла все, о чем ты рассказывал, не осталось ни одного вопроса, все максимально понятно!) То, что ты делаешь - нереальный труд и огромная инвестиция в будущих программистов)) Не представляю сколько времени тебе заняло научиться так четко и легко объяснять сложные вещи...Спасибо большое!))
@vasilymishanin
@vasilymishanin 2 роки тому
Спасибо за отличное видео, оно дает полное представление о работе webpack. Теперь не нужно искать тот самый сакральный конфиг )) Немного из 2022 (из Webpack 5) (возможно, я ошибаюсь, поправьте): - вместо CleanWebpackPlugin: просто добавить свойство clean:true в output; - вместо use:['file-loader']: можно прописать type: "asset/resource"; - на отсутствие @babel/plugin-proposal-class-properties у меня уже не ругался; - eslint-loader is deprecated: использовал eslint-webpack-plugin.
@RM-bc4pz
@RM-bc4pz Рік тому
Без babel/polyfill запускается асинхронная функция?
@langonar
@langonar Рік тому
Спасибо, мил человек
@AqVadPlay
@AqVadPlay Рік тому
@@RM-bc4pz Да, запускается с ним и без него
@AqVadPlay
@AqVadPlay Рік тому
"- на отсутствие @babel/plugin-proposal-class-properties у меня уже не ругался;" Потому что статик перешел на другой стейдж и ему теперь для работы отдельный плагин не нужен
@nikitachihranov1072
@nikitachihranov1072 Рік тому
@@AqVadPlay спасибо)
@borislobanov7896
@borislobanov7896 3 роки тому
Владилен, твои туториалы - просто огонь, спасибо тебе большое за твою работу, ты прям нереально помогаешь к собесам готовиться!
@garikmelqonyan9130
@garikmelqonyan9130 3 роки тому
Thank you once more, Vladilen for this awesome tutorial. As I have said in my previous comments, your tutorials are of high value for those who want to learn something new. They stand out with null unnecessary talk and much useful info explained step by step. In this video, it became clear to me how js frameworks(react, vue) work and why are there so many files. Thank you so much because to sit down and figure out all these things would be really hard for one and you have done it for your auditory.
@jimlabable
@jimlabable 4 роки тому
Это мой третий подход к Webpack - у ! Оказывается он совсем не такой страшный! Владилен у тебя талант делать сложные вещи простыми!
@oleglego8673
@oleglego8673 2 роки тому
он вновь становится страшным после каждого braking changes обновления...
@senails2859
@senails2859 Рік тому
это сарказм?
@yamuru22
@yamuru22 4 роки тому
Видео просто 11/10. Просмотрел курс за один присест на скорости 2х. Хочу отметить, что у Вас очень четкая речь и на такой скорости я могу прекрасно понимать, что Вы говорите. Спасибо большое!
@user-uo5pk3nj3n
@user-uo5pk3nj3n 4 роки тому
вот это огонь, СПАСИБО!
@alexchromets
@alexchromets 4 роки тому
То, что нужно и чего всегда не хватает. Спасибо!
@user-sz8yg7oe6g
@user-sz8yg7oe6g 4 роки тому
Владилен, спасибо за видео. Все понятно, без лишней воды. Это мое первое видео на твоем канале, теперь знаю чем заняться на выходных. Жду с нетерпением видео по ESlint. А то толковых гайдов по ниму днем с огнем. Ты реально круто доносишь информацию. Еще раз спасибо.
@SlavaSanin
@SlavaSanin 3 роки тому
Курс - БОМБА!!! Спасибо огроменное!!! Я в восторге! Владилен, ты самый крутой препод!!!
@maksymleonidov7059
@maksymleonidov7059 4 роки тому
25:01 Скорее всего у автора также установлен webpack-cli и глобально, иначе бы команда webpack не вызвалась из терминала. Чтобы не ставить webpack-cli глобально, можно запускать команду в виде 'npx webapck' или создать script в package.json, с помощью которого можно буде вызывать локально установленный webpack
@olegpristashkin9078
@olegpristashkin9078 3 роки тому
а что это даст?
@unheilbar
@unheilbar 3 роки тому
@@olegpristashkin9078 тогда он будет использоваться с директории node_modules/.bin
@user-yw3xd6ng3c
@user-yw3xd6ng3c 3 роки тому
@Exa1t у меня тоже самое. Кто нибудь нашел решение?
@user-xc2zz5dq7r
@user-xc2zz5dq7r 3 роки тому
@Exa1t далее когда импорты пропишешь, подхватит
@zubrdens
@zubrdens 2 роки тому
Спасибо за совет, поставил глобально (npm install --global webpack-cli), тогда команда webpack прошла.
@oOIMAXIOo
@oOIMAXIOo 4 роки тому
Ты герой современного программирования!
@Darkrogua
@Darkrogua 4 роки тому
@@ne4to777 У зоракса немного другой подход
@Time_Leak
@Time_Leak 4 роки тому
Большое спасибо за видео. Приятно, что все действия сопровождаются подробным описанием. И отдельное спасибо за "живые" ошибки: увидеть что может сломаться и как это починить очень важно при освоении нового.
@SlavaSanin
@SlavaSanin 4 роки тому
Видеоролик - "БОМБА"!!! Спасибо огромное! Владилен - ты лучше всех!!! Когда ищу в UKposts какой-то материал, сначала ищу его от тебя и только потом от остальных!
@stereogrid
@stereogrid 4 роки тому
Вот что такое "шок контент"... Владилен, ты просто мега крут
@_batia_es
@_batia_es 4 роки тому
"можно помедленнее, я записываю" ©️ спасибо! много чего стало понятно, буду пробовать применять на практике 🎓. жму руку и палец вверх. 🖖
@terra2411
@terra2411 4 роки тому
Канал Владилена это просто открытие для начинающих фронтэндеров. Все вопросы раскладываются в голове по полочкам. Огромное спасибо за такой труд!
@annagardt2360
@annagardt2360 3 роки тому
Владилен, спасибо за урок! Несмотря на то, что некоторые параметры уже записывать немного по другому, видео очень помогло. Урок классный, понятно изложен материал!!!
@nikita7978
@nikita7978 4 роки тому
Спасибо, из всех кого я когда-либо смотрел, твои видео самые понятные и их приятно смотреть
@MDanshin
@MDanshin 4 роки тому
Как обычно - лайк не глядя! Уверен, что контет самый лучший, как обычно!
@OlegSh
@OlegSh 4 роки тому
Отличный материал, полный без ошибок в коде, проверено 100%. Владлен, огромная благодарность вам за работу!
@creemer
@creemer 4 роки тому
Хлопаю стоя! Курс огонь! Взял на вооружение для обучения джунов!
@lenakosyakova879
@lenakosyakova879 4 роки тому
Лайк срочно! )) Спасибо, Владилен!
@filippkotenko851
@filippkotenko851 4 роки тому
Как всегда приятно обучаться по твоему контенту, все четко, грамотно и понятно. Спасибо Владилен.
@IliaLokalin
@IliaLokalin 4 роки тому
Сверх ясное и понятное объяснение. Все до мелочей!) Спасибо!
@user-bh2yn6zx8s
@user-bh2yn6zx8s 3 роки тому
для webpack-dev-server: "start": "webpack serve --mode development --open"
@nefertisu6818
@nefertisu6818 3 роки тому
спасибо
@aviaavia9147
@aviaavia9147 3 роки тому
Спасибо помогло
@victorirzunov3108
@victorirzunov3108 3 роки тому
Спасибо.
@ramilnazmiev9448
@ramilnazmiev9448 3 роки тому
Спасибо
@user-qx6gp9ci5d
@user-qx6gp9ci5d 3 роки тому
спасибо!!
@stanislavgerasimov3534
@stanislavgerasimov3534 4 роки тому
Лайк не глядя, когда понимаешь, что следующие три часа пройдут офигенно
@VladilenMinin
@VladilenMinin 4 роки тому
Приятного просмотра)
@igortobert
@igortobert 4 роки тому
поддерживаю!
@ilikecola378
@ilikecola378 3 роки тому
3*4 если пробовать и изучать
@natalyavasileva7931
@natalyavasileva7931 2 роки тому
Абсолютно согласна🤩
@oleksandrsavych4526
@oleksandrsavych4526 4 роки тому
Давно хотел разобраться с кучей ключей-конфигов для Webpack и очень рад, что нашел это видео! Спасибо большое, Владилен!
@igorkulebyakin7369
@igorkulebyakin7369 2 роки тому
Давно собирался разобраться с вебпаком, и попал на это видео. Никакой воды, все в точку, все что надо знать любому фронтендеру - сжато, но подробно и грамотно. Владилен, спасибо! Буду теперь советовать всем коллегам.
@user-pp5vq8ny6y
@user-pp5vq8ny6y 4 роки тому
Влад, твои курсы очень помогают подтягиваться по стэку, а вебпак прямо вишенка на торте) Огромное спасибо)
@VladilenMinin
@VladilenMinin 4 роки тому
Рад слышать)
@user-uo5pk3nj3n
@user-uo5pk3nj3n 4 роки тому
Владилен круто будет увидеть ролик по eslint настроеный и видео по тестам на jest
@user-fv1kz6jq9k
@user-fv1kz6jq9k 3 роки тому
Видеоурок - Топ! Спасибо огромное, больше бы таких уроков
@user-du3iz7qz7l
@user-du3iz7qz7l 4 роки тому
Благодарю. Все доступно и понятно, без лишней воды. Просмотрел на одном дыхании. Краткий конспект на 3 страницы вышел.
@vladislavozinkovskyi8276
@vladislavozinkovskyi8276 3 роки тому
касательно "Автоматизации копирования статических файлов" 1:41:21 После обновления до 3.11 появился новый шаблон , следующая запись теперь должна выглядеть вот так: new CopyWebpackPlugin({ patterns: [ { from: path.resolve(__dirname, "src/favicon.ico"), to: path.resolve(__dirname, "dist") }, ] })
@chugundur
@chugundur 3 роки тому
Дай бог вам здоровья
@olegpristashkin9078
@olegpristashkin9078 3 роки тому
почему?
@victorirzunov3108
@victorirzunov3108 3 роки тому
Спасибо.
@user-jf4cz7fu5p
@user-jf4cz7fu5p 3 роки тому
Спасибо. А то устал с этой частью разбираться, что не так.
@maximminchenko7633
@maximminchenko7633 4 роки тому
Уфффф) Просто лайк не глядя! UPD: было бы круто разобрать и Eslint
@user-jx8dh2de3e
@user-jx8dh2de3e 4 роки тому
Владилен, огромнейшее спасибо! Это космос.) Каналу в топ осталось пожелать, а плюсов в карму ты и так дофига заработал; ))
@user-ti3kc5xt8m
@user-ti3kc5xt8m 4 роки тому
Безусловно эти 3 часа потрачены не зря ). Спасибо за видео. Несмотря на продолжительность все очень ёмко.
@user-lg7yq6ky1r
@user-lg7yq6ky1r 2 роки тому
С развитием вашего канала все директора платных курсов плачут и с валерьянкой "ждут" новых выпусков) спасибо за ваш труд!
@imCitRUS
@imCitRUS 4 роки тому
Давай ESLint) И Jest было бы неплохо :) А видео топ! Спасибо)
@user-jp4te9zw2r
@user-jp4te9zw2r 4 роки тому
я за
@Dozortsev
@Dozortsev 4 роки тому
я тоже
@alexandrbalashov7543
@alexandrbalashov7543 3 роки тому
поддерживаю
@AlinaSiomukha
@AlinaSiomukha 3 роки тому
+ 1 и еще Jest + React
@user-cy5hf5gi8n
@user-cy5hf5gi8n 3 роки тому
+1!
@nikolai4100
@nikolai4100 3 роки тому
Владилен, спасибище! Я на ваших видео прям прокачася по многим темам! Патерны, вебпак, промисы, фетч. все огонь!
@konstantinpak2496
@konstantinpak2496 3 роки тому
Как всегда видос на высшем уровне! Спасибо тебе огромное за твой труд!
@zerocool14pvo
@zerocool14pvo 4 роки тому
Лайк не глядя!
@johnd1431
@johnd1431 4 роки тому
жжошь Влад, 3 часа информативного контента!
@VladilenMinin
@VladilenMinin 4 роки тому
Сам удивился, что так много подготовил)
@johnd1431
@johnd1431 4 роки тому
Владилен Минин я не успеваю твои старые ролики пересмотреть, пока штудирую старое - выходит новое. Вот это уровень
@VladilenMinin
@VladilenMinin 4 роки тому
@@johnd1431 И мы только начинаем)
@duce201
@duce201 4 роки тому
Такое классное видео! Наконец-то начал понимать для чего нужен webpack и как он работает! Спасибо огромное за труд!!!
@user-rk3nx6vd4r
@user-rk3nx6vd4r 2 роки тому
Владилен, спасибо большое! Давно слежу за вашей работой и подписан, понадобилось вспомнить и сразу подумал что здесь найду лучшее и не ошибся!
@user-iu9ws5de7t
@user-iu9ws5de7t 3 роки тому
Спустя 3ч. "Ура, мы закончили с базой вебпака" ААААААААААААА
@TheWorldPeace
@TheWorldPeace 4 роки тому
Ура, спасибо большое за курс. То что нужно, всегда в тему.
@user-bp3vk3uj8h
@user-bp3vk3uj8h 3 роки тому
Ну как бы ура. наконец-то вменяемый человек адекватным языком объясняет, что и зачем в нужном объеме для понимания, но не слишком глубоко, чтобы не чувствовать себя полным критином. Спасибо Владилен. Чисто, Ясно, Информативно и можно сразу брать на вооружение.
@johnd1431
@johnd1431 4 роки тому
включайте колокольчик на канале, если тоже хотите в топы вывести Владилена
@ivan_sukhachev
@ivan_sukhachev 4 роки тому
Большое тебе человеческое спасибо, мужик!! Очень полезно и информативно. Нет воды, приятно слушать, подача материала четкая и внятная. Это большая и качественная работа. Отблагодарил на ЯД, еще раз спасибо!
@gamides
@gamides 2 роки тому
Огромное спасибо за курс! Лучший учитель, все понятно и интересно!
@TemkaMineCraft32rus
@TemkaMineCraft32rus 2 роки тому
1:09:00 ! Для тех людей, у которых создаётся лишняя картинка, нужно в конфиге вместо use: ['file-loader'] написать type: 'asset/resource'
@user-sr8eo3ct9h
@user-sr8eo3ct9h 2 роки тому
Работает, а почему так ?
@unrealz3129
@unrealz3129 2 роки тому
​@@user-sr8eo3ct9h webpack 5 версии решил сделать их из коробки, для упрощения работы с другими созависимыми модулями.
@velsh3946
@velsh3946 2 роки тому
спасибо!
@user-np3rm3kq4z
@user-np3rm3kq4z 2 роки тому
Спасибо:)
@lalathealter6513
@lalathealter6513 2 роки тому
Спасибо
@alexandrmerser8443
@alexandrmerser8443 3 роки тому
Отличный курс! Помог разобраться с базовыми вещами, и теперь не страшно смотреть в конфиги webpack-а на проектах) Большое спасибо, Владилен, ты большой молодец!
@Gor0d
@Gor0d Рік тому
Огромное спасибо за урок!!! Не без страданий и гуглёжа, но я его осилил и многое понял! Пометки из 2023: 1) если у вас стоит расширение jshint - удаляйте его НЕЗАМЕДЛИТЕЛЬНО! (из-за него я настрадался при подключении React) 2) по BundleAnalizerPlugin - может не сработать, а вернее не сработает, если импортируете так, как показано в уроке. Делайте так: - const BundleAnalizerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; 3) решения по остальным несостыковкам, возникающим в связи с развитием webpack с момента записи урока - ищите в комментариях
@hwd1978
@hwd1978 3 роки тому
Спасибо огромное! Отличный урок! А за тайм-коды в описании - вообще суперский респект! :)
@daurenaidenov1992
@daurenaidenov1992 2 роки тому
2:43:20 У кого в Webpack 5 не работают динамические импорты вместе с lodash, то вместо "import('lodash').then(_ => {})" пишем "import('lodash').then(({ default: _ }) => {})"
@user-cr8ln4rm4u
@user-cr8ln4rm4u 2 роки тому
спасибо!
@user-rn3et9eh5x
@user-rn3et9eh5x 2 роки тому
import("lodash").then(({ default: _ }) => { console.log("Lodash\t", _.random(0, 27, true)); });
@nikitachihranov1072
@nikitachihranov1072 Рік тому
спасибо большое!
@nikitachihranov1072
@nikitachihranov1072 Рік тому
и еще у меня в dist файл 0.js не появился. Хотя все работает.
@brabus765
@brabus765 Рік тому
25:24 npx webpack так компилируется сейчас
@vladislavozinkovskyi8276
@vladislavozinkovskyi8276 3 роки тому
Немерено вложено труда в данное видео. Разложил webpack по полочкам просто и доступно. Спасибо!
@669pain
@669pain 4 роки тому
Самый полный и понятный ролик по вебпак. От души, всех благ тебе
@romanliapkin5174
@romanliapkin5174 4 роки тому
На конец то бл*ь, нормальное объяснение.jpg . Не очень люблю видео гайды, не удобно отматывать и искать что то повторить, но нормальных текстовых туториалов по вебпаку нет, от слова совсем. Но ваш туториал прям путеводная звезда! Хоть кто то в полном объеме объясняет что происходит, и что нужно делать. Спасибо за огромный труд.
@user-bg6hk5in8q
@user-bg6hk5in8q 3 роки тому
Огромное спасибо за курс! Отличная работа! Приятно Вас слушать! Лайк и подписка!!!
@user-lg4md8wm8y
@user-lg4md8wm8y 3 роки тому
Тупо лучший ютубер!!! Пишу любой запрос по js и открывается именно твое видео, есть просто все что нужно! Респект
@coderslav4505
@coderslav4505 2 роки тому
Не знаю, как у вас, но у меня file-loader ломает картинку (она не открывается) при работе с CSS (например, при использовании в background-image). Нашел решение: не использовать file-loader :) Оказывается в webpack есть встроенный file-loader. Просто пропишите следующее правило, вместо правила на использования file-loader: { test: /\.(png|svg|jpg|jpeg|gif)$/i, type: 'asset/resource' }
@hlebhlebowski
@hlebhlebowski 2 роки тому
верно, я часа полтора решал эту проблему. и момент в этом видео хватает подобных. все приходилось гуглить... не особо актульное видео.
@kaelnlarien7623
@kaelnlarien7623 2 роки тому
вебпак у вас 5 версии, а на то время её не было
@deniskotov
@deniskotov 2 роки тому
Реально сработало, спасибо. 3 дня пытался понять, что не так.
@romko-romario
@romko-romario 2 роки тому
Искренне благодарю, помогло! А я-то думаю, в чём беда. Думал, потому, что использую sass-loader, а оно вот что.
@maksimaisin743
@maksimaisin743 2 роки тому
спасибо мужик! а то я прям голову сломал! причем до установки file-loader все работало, и я не сразу понял, что сломалось именно из-за этого.
@AlexanderShinigami
@AlexanderShinigami 2 роки тому
clean-webpack-plugin в пятом вебпаке уже не нужен, можно просто в output прописать настройку clean: true
@and9133
@and9133 4 роки тому
Спасибо за курс! Наконец-то появился повод разобраться в вебпаке) Пили теперь курс по Jest и Eslint!
@vmpartner
@vmpartner 4 роки тому
Посмотрел на одном дыхании, очень доступно рассказываете, подписался, спасибо за труд!
@whyNotCookies
@whyNotCookies 3 роки тому
Если пишете в vsCode и вдруг возникнет проблема с MiniCssExtractPlugin Error: Automatic publicPath is not supported in this browser Получилось победить так: test: /\.css$/, use: [ { loader: MiniCssExtractPlugin.loader, options: { publicPath: path.resolve(__dirname, 'dist') }, } ,'css-loader' ]
@annagardt2360
@annagardt2360 3 роки тому
Спасибо! Мне помог Ваш комментарий!
@denideni2633
@denideni2633 3 роки тому
Брат ты лучший)
@user-cd1sr5sx2r
@user-cd1sr5sx2r 3 роки тому
Спасибо!
@user-kv5xf8qw7f
@user-kv5xf8qw7f 3 роки тому
Две чашечки чая этому господину!
@user-xl9ob4xy1x
@user-xl9ob4xy1x 3 роки тому
....Да обрящет ищущий! Спасибо дружище! Двое суток в ступоре, и ищу ответ на описание MiniCssExtractPlugin именно на этот Error: Automatic publicPath... и т.д. Интернет выдает много, да всё не то. Хорошо что мелькнула мысль заглянуть сюда в этот чат. Огромное спасибо.
@aviaavia9147
@aviaavia9147 3 роки тому
Для тех у кого проблемы с установкой optimize-css-assets-webpack-plugin, установите его вот таким способом: 1) npm i -D optimize-css-assets-webpack-plugin@4.0.0 2) npm audit fix --force И тогда в packege.json появится этот плагин последней версии
@BestMusicTheAppolo
@BestMusicTheAppolo 2 роки тому
Помогло спасибо!
@arinokaz
@arinokaz 4 роки тому
Воу Воу)) вот это подгон. Спасибо большое, как раз начал разбираться с webpack'ом.
@craioffear2619
@craioffear2619 Рік тому
Просто лучший курс по вебпаку! 3 дня по 10 часов рыл все что можно, ничего не получалось, посмотрел твой курс в 3 часа и все получилось) спасибо тебе!
@user-yq5vv1yp4b
@user-yq5vv1yp4b 3 роки тому
Для тех кто смотрит в 2021 hmr больше прописывать не надо!
@dyscyber
@dyscyber 2 роки тому
@@dasi4301 у мамы спросил. А как ты думаешь где?) Может быть на официальном сайте webpack, который регулярно обновляется?)
@dyscyber
@dyscyber 2 роки тому
@@dasi4301 да не "агрюсь" я. Просто вопросы найглупейшие. Понимаю теперь, что ты ещё подросток, судя по твоей фразе "агриться", однако пойми - в прогинге и разработке приложений нечего делать, если человек не умеет самостоятельно искать информацию, ибо это будет составлять минимум 70% всей твоей работы.
@PWBastille
@PWBastille 2 роки тому
щастья, здоровьечка тебе, добрый путник, ты сэкономил мне кучу времени и нервов)
@1604MafiaBest
@1604MafiaBest 3 роки тому
Итак судя по всему в новой версии webpack на 26/11/20 нельзя запустить webpack-dev-server --open, во первых теперь команда выглядит так "start": "webpack serve", а для дополнительных опций, таких как открытие окна браузера переходим в конфиг и в module.exports{devServer: { open: true}}
@artthemad
@artthemad 3 роки тому
спасибо тебе!!! помогло!!!
@beramaks
@beramaks 3 роки тому
Спасибо! Покрыл огромный пласт и разложил всё по полочкам. Это супер курс!
@nickchernyavsky3929
@nickchernyavsky3929 4 роки тому
Вроде не раз сталкивался с вэбпаком, но видос зашёл на ура. Очень много нового узнал, спасибо! Очень жду курс по nest.js
@str1ve450
@str1ve450 2 роки тому
Владилену большое спасибо за видео, а для тех, у кого webpack 5 версии или более, и при установке optimize-css-assets-webpack-plugin ошибки, устанавливайте css-minimizer-webpack-plugin
@user-yk9nj6co9d
@user-yk9nj6co9d Рік тому
Да хранит тебя Аллах, мил человек )
@vladosk-lv6kp
@vladosk-lv6kp 4 роки тому
Отличный курс, спасибо большое! Есть пара вопросов 1) Как вставлять картинки через img? Путь указывать относительно исходного индекса или от скомпиленого? 2) Как в папке dist сохранить удобную структуру - папки со скриптами, стилями, картинками и т.п.
@nikolakovac65
@nikolakovac65 3 роки тому
Нашел решение?
@KG-eo1mg
@KG-eo1mg 3 роки тому
@@nikolakovac65 Нашел решение?
@desltiny2884
@desltiny2884 3 роки тому
@@KG-eo1mg Есть решение?
@desltiny2884
@desltiny2884 3 роки тому
@@nikolakovac65 Не нашёл решения?
@SilverStormAndGoldenRain
@SilverStormAndGoldenRain 3 роки тому
​@@nikolakovac65 webpack.js.org/configuration/entry-context/#entry
@coderslav4505
@coderslav4505 2 роки тому
Спасибо ОГРОМНОЕ за ОГРОМНУЮ работу, Владилен! Да, некоторые моменты уже устарели, но все равно большая часть видео ещё актуальна. Жду ремейк ;)
@eduardomavlyutov4710
@eduardomavlyutov4710 4 роки тому
Спасибо большое! Взял на udemy ваш курс по React, разберусь с вебпаком и возьмусь на него)
@pavel.arepev
@pavel.arepev 3 роки тому
Если у кого не работает SASS на 2:07:10 : попробуйте переписать вместо test: /\.s[ac]ss$/, на test: /\.(sass|scss)$/,
@dangor220
@dangor220 2 роки тому
В моем случае помогла следующая строка: test: /\.sass$|scss/,
@gladiatorrussia
@gladiatorrussia 3 роки тому
Пожалуйста сделай курс по Webpack 5
@timofeysyr5163
@timofeysyr5163 3 роки тому
а в видео разбирался лоадер для pug?
@timofeysyr5163
@timofeysyr5163 3 роки тому
просто лень искать
@gladiatorrussia
@gladiatorrussia 3 роки тому
@@timofeysyr5163 нет
@Baiterr
@Baiterr 3 роки тому
офигенный урок и самый доступный для понимания. Спасибо тебе большое!!
@user-lm2kj7kw7b
@user-lm2kj7kw7b 3 роки тому
Прекрасный материал! Большое спасибо.
@lockd0wnll178
@lockd0wnll178 4 роки тому
Я человек простой, вижу твои видосы - сначала лайкаю, а потом смотрю xd
@VladilenMinin
@VladilenMinin 4 роки тому
Классный алгоритм)
@user-sh7bb6hk6f
@user-sh7bb6hk6f 4 роки тому
Аналогично.
@user-sh7bb6hk6f
@user-sh7bb6hk6f 4 роки тому
Я вообще как зашел на канал завис по полной. Не могу оторваться.
@beefeater5427
@beefeater5427 4 роки тому
UKposts плохо относится в видео, которые лайкают до просмотра. Поэтому посмотри хотя бы до половины перед лайком
@user-lr9ed1hu2j
@user-lr9ed1hu2j 4 роки тому
@@VladilenMinin ну вообще, говорят что ютьюб не засчитывает лайк, если сначала его ставишь, а потом смотришь видос. Так что в алгоритме баг завёлся)
@vitalytochenyy481
@vitalytochenyy481 2 роки тому
Это просто нереально крутой и нереально подробный курс по webpack!!! Спасибо владилен!! До конца ещё не досмотрел, однако все проблемы уже решил с вашей помощью!!! Обязательно досмотрю до конца, чтобы подчерпнуть ещё кучу разных фич!!
@egrpavlov2694
@egrpavlov2694 2 роки тому
Ого, оч качественно классно информативно. Не хотелось как-то начинать с webpack`ом разбираться, а оказалось, что эти знания супер полезные
@alexsoft7073
@alexsoft7073 3 роки тому
Владилен, сделай пожалуйста курс на Webpack 5, много чего уже поменялось Лайк, чтобы в топ
@sanlaynx
@sanlaynx 3 роки тому
а какой смысл? чуть меняется синтаксис , а в целом в данном видео понятна вся суть и механика пакета
@george6514
@george6514 3 роки тому
1:47:08 У кого выдаёт "Automatic publicPath is not supported in this browser", пропишите в options: publicPath: (resourcePath, context) => { return path.relative(path.dirname(resourcePath), context) + '/'; }
@user-eo4rp8fd8n
@user-eo4rp8fd8n 3 роки тому
Спасибо за помощь
@user-xd6ev4gz2k
@user-xd6ev4gz2k 3 роки тому
хахахахах, такая же ошибка была, гуглил час, разобрался, хотел написать как решить эту проблему, и вдруг ты тут с таким же решением, ты где был час назад?)
@emagcodeshake
@emagcodeshake 3 роки тому
Спасибо! ))
@user-ki7tk2lt5p
@user-ki7tk2lt5p 3 роки тому
Довольно подробно описана работа Webpack. Это видео просто находка. Спасибо в очередной раз Владилену! P.S. Спасибо ребятам, которые делятся в комментариях командами для терминала.
@user-lk3dn7yz5b
@user-lk3dn7yz5b 3 роки тому
Огромное спасибо за курс! Как всегда доходчиво и понятно))
@danko5678
@danko5678 3 роки тому
Сейчас file-loader для картинок и шрифтов не нужен, просто прописываете в конфиге test: /\.(?:ico|gif|png|jpg|jpeg)$/i, type: 'asset/resource', и test: /\.(woff(2)?|eot|ttf|otf|svg|)$/, type: 'asset/inline', соответственно
@killd0z3r
@killd0z3r 10 місяців тому
Какая версия ноды в проекте? Ловлю кучу ошибок при запуске исходника
@SemoAborigen
@SemoAborigen 2 роки тому
Спасибо за материал! Посмотрел до конца, многое стало понятно. Раньше WebPack просто пугал, не знал с чего начать изучение! :)
@weblegko
@weblegko 4 роки тому
Красавчик ! Спасибо! Я теперь твой постоянный зритель ) . Очень хорошо излагаешь - респект! Не пропускаю ни одного видоса ))). Webpack очень кстати - в наглядной форме закрыл некоторые пробелы в знаниях. Хотелось конечно еще бы увидеть тут про интеграцию с browsersync и адаптацию webpack для работы в связке с php ( в том числе и hmr), например при разработке wordpress-темы. Но это мои нескромные хотелки. А ваще, все твои курсы - это бомба!
SOLID Принципы в JavaScript
1:15:00
Владилен Минин
Переглядів 213 тис.
Топ 10 ИИ каждый программист должен знать
22:46
Владилен Минин
Переглядів 21 тис.
Зомби Апокалипсис  часть 1 🤯#shorts
00:29
Module Bundlers Explained... Webpack, Rollup, Parcel, and Snowpack
9:56
Git и GitHub Курс Для Новичков
49:35
Владилен Минин
Переглядів 1 млн
Разбираем основы Kafka и RabbitMQ
26:54
Digital train | Alex Babin
Переглядів 7 тис.
FRONTEND: Мифы и Реалии рынка труда
34:43
Владилен Минин
Переглядів 39 тис.
50 вопросов на React JS собеседование
52:45
Владилен Минин
Переглядів 327 тис.
Будущие работы: какие навыки будут востребованы
32:53