custom.js to be required or chained on mix?

Hello,

I just want to include a javascript file (which also contains jquery) to the compile list of mix. For my understanding there are at least two ways for that.

Chaining the file to the mix Object like so:

mix.js('resources/js/app.js', 'public/js')
    .js('resources/js/custom.js','public/js')
    .sass('resources/sass/app.scss', 'public/css');

Adding an require Command to app.js like so:

require('./bootstrap');
require('./custom');

Is this correct? I would like to have one mixed file. Chaining doesn't really work since its making a new file.

How do you do it - what are common ways to include / mix custom javascript Code? I would not put the file into the public/ directory to access it there manually. If there is a way to compile and "uglify" the code, it would be perfect.

aurawindsurfing

5 years ago

Level 50

Hi @mikegk

You could do it like that:

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

and in your app.js

require('./bootstrap');
require('./custom');

Or simpler:

mix.scripts([
    'public/js/app.js',
    'public/js/custom.js'
], 'public/js/all.js');

Hope it helps!

1 like

Mikegk

5 years ago

Level 3

...yes indeed it does, thanks.

I wonder if I can call functions located in mixed files elsewhere in my code because I cannot find them by search inside the compiled file:

testit(){
 alert("TEST COMPLETED");	
}

"testit(" was not found in app.js :/

aurawindsurfing

5 years ago

Level 50

@mikegk

As long as mixed js is loaded they all should be available. There could be some cache holding your older mix file and therefore not being available have alook here: https://laravel.com/docs/master/mix#versioning-and-cache-busting

add this at the end of your mix:

mix.scripts([
    'public/js/app.js',
    'public/js/custom.js'
], 'public/js/all.js')
    .version();

also make sure you are loading all.js and not app.js in your app.blade.php

1 like

Please or to participate in this conversation.