Webpack getting started with Laravel. How to setup workflow? - laravel-5

I am currently using Webpack with Laravel to manage dependencies on a new project. My current workflow looks like this:
npm install whatever-package
require('whatever-package'); (in frontend.js)
GulpFile.JS >
elixir(mix => {
//the core scss file. contains bootstrap and vendor stuff.
mix.sass('frontend.scss')
.webpack('frontend.js');
}
run gulp
Frontend.js is then included in my PHP template. This would work great for a single page application, but if I want to have one javascript file, and multiple web pages what technique should I be using to pull in javascript for other pages?
Should I have multiple JS files all webpacked with Elixir? Or what is the next step to require in the right files?
i.e. does Webpack support a single entry point where I can start to load other scripts via data attributes? I've used this technique with requireJS previously, and just trying to wrap my head around the best way to do this with Webpack.

Related

Parcel build process and creating files

I'm using parcel for a vanilla JS project and want to intercept the build process to generate path-based routes kind of like nuxt, gatsby, next etc...
For that I need to intercept the build process, create the routes in a file and stuff, but I tried to follow Parcel Bundler API to no success, besides, I don't know if I'm palcing the file correctly, right know I'm using an index.js as a sibling to package.json and the scripts run parcel index.js.
Could anyone help me figure this out? Thanks.

Live Edit in PhpStorm for Laravel projects

I like to use Live Edit feature, however, it seems to me it only works with regular .html files, however, none of the known to me ways work with Laravel .blade.php files. Google didn't answer.
Is there really no way to do so?
For Laravel projects, you can use BrowserSync to automatically refresh websites when you make changes to your template files. Support for BrowserSync comes out of the box with Laravel Mix. To use this feature, all you have to do is go to your webpack.mix.js file and add the mix.browserSync() function call. If you're using Laravel Valet or something similar to get pretty URLs, you can pass in a URL as an argument to proxy.
mix.browserSync();
// OR
mix.browserSync('my-domain.test');
Documentation: Compiling Assets (Mix)

React app on deployment server

I have an Ubuntu VPS with Laravel v5.6 served with nginx, and I am trying to use React on the front-end. I don't know if this is possible what I want to do is:
use node and npm to build my front-end app locally,
generate the CSS and JS files and upload those already generated files to my VPS server,
the output should not change since as far as I know npm generates at JS and CSS files with your whole code in it
Thanks for the help, and if there is any suggestion for a different approach just let me know.
You should start to use a frontend bundling solution like webpack or parcel, they do exactly the same
If you generate your app with create-react-app it comes with webpack built-in

Quasar CLI integrated with Laravel mix

I have an application in which I am developing using Laravel + VueJs with Laravel mix (both back and front end within the same folder structure) and now I want to start using Quasar.
Is it possible to integrate the Quasar CLI together with the Laravel Mix and continue using the same folder structure? If so, how to generate the build script?
Will there be any changes in the deploy script?
I assume that Quasar CLI builds all assets into static files; js / css. My opinion is compiling Mix's assets first and pass the out put (js / css) to Quasar by configuring at quasar.config.js then running quasar build.
Or It might able to config quasar.config.js to load all Mix' assets.
this docs might help https://quasar-framework.org/guide/app-quasar.conf.js.html

Load css/js files in Laravel 4 with Composer?

I'm working on creating a new project in Laravel 4. I have a tiny bit of experience in Laravel 3, in which I got used to the assets system. I'm now having a lot of trouble figuring out how to load CSS and JS files in the new system.
I believe I should be using Composer PHP, but I'm not sure how. Where do I put the actual .css and .js files? And then how do I load them with Composer to be utilized in the Laravel project?
I know there are outside plugins like Best Asset, etc. that are written to replicate the Assets system of Laravel 3, but I was hoping to understand the new system and not have to use an outside plugin.
Any help? Thanks.
You don't need Composer for your css/js assets. You can use assets pretty much the same as with Laravel 3
You can just place them in your public folder and reference them in your views. You can use plain html, or use the HtmlBuilder: HTML::style('style.css') and HTML::script('script.js')
You must take care of case sensitive.
This class must write with uppercase.
HTML::style('style.css');
HTML::script('script.js');
Laravel stylesheets and javascript don't load for non-base routes

Resources