I have an app that uses two different javascript files based on how the site is entered. I have my mix files set up like below. However, whenever I try to compile it the second .js() just overwrites the first file regardless of where the output path is set to.
let mix = require('laravel-mix').mix;
mix.js('resources/assets/js/app.js', 'public/js')
.extract(['vue','lodash','axios','moment'], 'public/js/vendor.js')
.js('resources/assets/js/scanner/app.js', 'public/js/scanner/app.js')
.copy('resources/assets/js/scanner/eb', 'public/js/scanner/eb');
Here is the output from the terminal:
DONE Compiled successfully in 3104ms
Asset Size Chunks Chunk Names
js/scanner/eb/eb.navbar.js 758 bytes [emitted]
/js/app.js 1.21 MB 0 [emitted] [big] app
js/scanner/eb/eb.audiocapture.js 2.78 kB [emitted]
js/scanner/eb/eb.camera.js 5.19 kB [emitted]
js/scanner/eb/eb.application.js 4.37 kB [emitted]
js/scanner/eb/eb.cardreader.js 2.98 kB [emitted]
js/scanner/eb/eb.barcode.js 25.8 kB [emitted]
js/scanner/eb/eb.battery.js 1.55 kB [emitted]
js/scanner/eb/eb.connectionchecking.js 772 bytes [emitted]
js/scanner/eb/eb.database.js 2.17 kB [emitted]
js/scanner/eb/eb.device.js 1.1 kB [emitted]
js/scanner/eb/eb.database.sqlite3.js 1.48 kB [emitted]
js/scanner/eb/eb.instrumentation.js 3.48 kB [emitted]
js/scanner/eb/eb.intent.js 922 bytes [emitted]
js/scanner/eb/eb.keystate.js 711 bytes [emitted]
js/scanner/eb/eb.log.js 1.78 kB [emitted]
js/scanner/eb/eb.keycapture.js 927 bytes [emitted]
js/scanner/eb/eb.mediaplayer.js 1.09 kB [emitted]
js/scanner/eb/eb.logcapture.js 962 bytes [emitted]
js/scanner/eb/eb.nativemenubar.js 776 bytes [emitted]
js/scanner/eb/eb.nativetabbar.js 1.15 kB [emitted]
mix-manifest.json 32 bytes [emitted]
js/scanner/eb/eb.nativetoolbar.js 977 bytes [emitted]
js/scanner/eb/eb.notification.js 1.13 kB [emitted]
js/scanner/eb/eb.network.js 2.19 kB [emitted]
js/scanner/eb/eb.printer.js 6.31 kB [emitted]
js/scanner/eb/eb.printerzebra.js 10.2 kB [emitted]
js/scanner/eb/eb.push.js 3.21 kB [emitted]
js/scanner/eb/eb.rhofile.js 2.28 kB [emitted]
js/scanner/eb/eb.screenorientation.js 1.02 kB [emitted]
js/scanner/eb/eb.sensor.js 2.34 kB [emitted]
js/scanner/eb/eb.signature.js 1.63 kB [emitted]
js/scanner/eb/eb.smartcradle.js 1.71 kB [emitted]
js/scanner/eb/eb.system.process.js 900 bytes [emitted]
js/scanner/eb/eb.timer.js 839 bytes [emitted]
js/scanner/eb/eb.system.js 4.52 kB [emitted]
js/scanner/eb/eb.webview.js 1.96 kB [emitted]
js/scanner/eb/eb.signalindicators.js 1.04 kB [emitted]
js/scanner/eb/ebapi.js 13.7 kB [emitted]
js/scanner/eb/ebapi-modules.js 204 kB [emitted]
js/scanner/eb/scanner.css 308 bytes [emitted]
js/scanner/eb/elements.js 142 kB [emitted]
It's a bug I'm fixing today. Until then, provide a full output path including the file name for your second mix.js() output
Thank you for the update.
Just so you know. I just recompiled with a different source name and it places the file in public/js instead of public/js/scanner.
myself i just want to know how to add multiple js library files such as jquery, animate,wow, superfish etc to laravel mix
This can be done by following way:
let mix = require('laravel-mix');
mix
/*Admin assets*/
.js('resources/assets/admin/js/admin.js', 'public/admin/js/admin.js')
.sass('resources/assets/admin/sass/admin.scss', 'public/admin/css/admin.css')
/*Common assets*/
.js('resources/assets/common/js/common.js', 'public/common/js/common.js')
.sass('resources/assets/common/sass/common.scss', 'public/common/css/common.css')
/*Front-End assets*/
.js('resources/assets/app/js/app.js', 'public/app/js/app.js')
.sass('resources/assets/app/sass/app.scss', 'public/app/css/app.css');
Above code will create three folders in public directory name admin, app, common with CSS and JS folders.
Now you can use them in different master layouts for admin panel and front-end.
...
Disregard my question, actually it works the issue was in my code :)
Most helpful comment
This can be done by following way:
Above code will create three folders in public directory name admin, app, common with CSS and JS folders.
Now you can use them in different master layouts for admin panel and front-end.