Laravel mix/webpack with scripts on specific pages?
I've maintained a project where we did a @stack('scripts') in the main blade layout, and on specific blades pages we would push any page specific stuff, like form validation via @push('scripts')<script></script>@endpush allowing us multiple snippets of javascript based on the blade templates.
Now I'm trying to go the app.js way with webpack, but I find that anything written in app.js is outside of the global scope (unless you attach it to window, but that seems tedious for utility functions ect). Would you have all the javascript for the website in one place, running it even if it's not related to the current page? Or how do I split out page specific scripts while using app.jsand webpack?
The answer would be in most cases - In one place as this file is being cached users need to download it only once. When this file is minified and stripped from all the junk that you do not need, like some crazy library that you only download to do one thing, then it is not that huge. Here is an example from laracasts.com, it looks like there are few files but they are really tiny as you can see.
Instead of going through all that, why not just lazy load them through the main app.js file? It's a lot easier to maintain and Webpack/Mix handles all the headaches for you.