how to load js and css scripts all at once in Laravel?
Using the @extend blade template will load the scripts again.
You should just need to install npm with command:
npm install
then make sure your package.json has laravel mix in the dependencies. Then run the command:
npm run dev
This will run you webpack.mix.js file, in your root directory, which you can compile js, scss, sass, css, vue components from your resources/assets/ directory.
You webpack.mix.js may look like this:
const { mix } = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/assets/js/app.js', 'public/assets/js');
mix.scripts([
'resources/assets/js/enum_gender_select.js',
'resources/assets/js/enum_title_select.js'
], 'public/assets/js/enum_select.js');
mix.sass('resources/assets/sass/app.scss', '../resources/assets/css/sass.css');
mix.styles([
'resources/assets/css/app.css',
'resources/assets/css/sass.css'
], 'public/assets/css/all.css');
Then your resources will be placed in the public\ or where ever you place them. Then you can reference them in your html views like so:
styles:
<link href="{{ asset('assets/css/all.css') }}" rel="stylesheet">
scripts:
<script src="{{ asset('assets/js/app.js') }}"></script>
<script src="{{asset('assets/js/enum_select.js')}}"></script>
Try it.
You can just pass the path to the style sheet .
{!! HTML::style('css/style.css') !!}
You can just pass the path to the javascript.
{!! HTML::script('js/script.js'); !!}
Add the following lines in the require section of composer.json file and run composer update "illuminate/html": "5.*".
Register the service provider in config/app.php by adding the following value into the providers array:
'Illuminate\Html\HtmlServiceProvider'
Register facades by adding these two lines in the aliases array:
'Form'=> 'Illuminate\Html\FormFacade',
'HTML'=> 'Illuminate\Html\HtmlFacade'
Refer this url : How to include External CSS and JS file in Laravel 5
OR
@extendthen the extended page will have all the includes of the parent page but if you never load the parent page then the scripts are only loaded once.