Basic Concepts in Mix / Webpack

Did you watch this full tutorial: https://laracasts.com/series/learn-laravel-mix

If you did I can answer the questions for you of course. But just want to make sure you watched that one ;)

Yes! These are a few of the minor things that weren't really addressed in the series.

@bobbybouwmann help me so I don't have to bug @JeffreyWay :)

Conceptually, what's the purpose of the bootstrap.js file? Is this just for registering globals? There's mostly window.whatevers in there...

To run the bootstrapers such as registering global libraries like jQuery, lodash, etc., to do "setup"... Just to make app.js cleaner.

Where should I import stuff like jquery-ui, sweetalert2, dropzone, etc. ? bootstrap.js? app.js? directly in my webpack.mix.js file? Somewhere else? I've seen it done several ways...

Doesn't really matter where you import them. Completely up to you. I usually import at app.js, since app.js comes with predefined Vue and I usually need to Vue.use() a library.

What's the general rule on libraries that are on a CDN? Is it better to just reference those in my blade files? Download them? Is there a way to add them into my mix file?

http://bfy.tw/GnQ6

https://stackoverflow.com/questions/3832446/benefits-vs-pitfalls-of-hosting-jquery-locally

https://webmasters.stackexchange.com/questions/92083/local-files-vs-cdn

https://halfelf.org/2015/cdn-vs-local/

Either reference a CDN, or concat them into app.js.

What about my own script files? Should I just require them in my app.js file? Do I need to concatenate them in my mix file?

Add them to resources/assets/js and import them like require('./my-script.js')

If you're serving like 3 different JS files from a local server (not a CDN), mix them into one file to not make browser make multiple trips to your server.

I believe you're making too big of a deal than it actually is. Just make sure you don't reference N scripts in your HTML file (like jquery, jquery.library1.js, jquery.library2.js, jquery.library3.js) from your own server, and you're good to go. Import (require) scripts in your source code where you use them and you're good.

Thanks for that! Not overthinking it really, I just want to know “why”. And my follow up question is why people import directly in the webpack.mix.js file as opposed to app.js?