Помогите дураку собрать проект с Webpack, ребят честно не давайте мне ссылки, мне надоело читать кучу бесполезных статей на хабре про то какой Webpack крутой и что вот он умеет 100500 извращений которые мне лично вообще не интересны, и пока ты про это все читаешь ты просто начинаешь тонуть в том что пишут те "гуру".
У меня есть небольшой сайтец имеющий такую структуру
├── css
│ ├── bootstrap.min.css
│ ├── elegant-icons.css
│ ├── font-awesome.min.css
│ ├── magnific-popup.css
│ ├── owl.carousel.min.css
│ ├── slicknav.min.css
│ └── style.css
├── fonts
│ ├── ElegantIcons.eot
│ ├── ElegantIcons.svg
│ ├── ElegantIcons.ttf
│ ├── ElegantIcons.woff
│ ├── FontAwesome.otf
│ ├── fontawesome-webfont.eot
│ ├── fontawesome-webfont.svg
│ ├── fontawesome-webfont.ttf
│ ├── fontawesome-webfont.woff
│ └── fontawesome-webfont.woff2
└── js
├── bootstrap.min.js
├── jquery-3.3.1.min.js
├── jquery.countdown.min.js
├── jquery.magnific-popup.min.js
├── jquery.slicknav.js
├── main.js
└── owl.carousel.min.js
Я хочу из всей этой кучи получить bundl.js и bundle.css что бы отдать пользователю 1 файл максимально сжатый.
Будет классно если можно что то подобное придумать со шрифтами, прочитав 11 статей вроде как что то подобное есть, но - это было бы плюсом но для меня совсем не важно.
Объясните мне как это собрать? просто jquery-3.3.1.min.js должен идти раньше чем jquery.slicknav.js а main.js должен идти вообще последним, и этот момент я лично не могу понять как сделать.
Помогите не осилятору собрать два бандла.