CODEWITHSUNDEEP
javascriptjquerywebpacklaravel-mixpjax
Justin
Justin

Reputation: 37

JS errors when trying to use Laravel mix / webpack

I have a webpack mix file, which looks like this.

let mix = require('laravel-mix');  
let basePath = 'app/Resources/assets/sass/';  
let jsPath = 'app/Resources/assets/js/';  
mix.setPublicPath('./web');  
mix.browserSync({proxy: 'rooms.test', ghost: false});
   .js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
mix.sass(basePath + 'base.scss', 'web/assets_static/css');

mix.combine(['./node_modules/imagesloaded/imagesloaded.pkgd.js',
    './node_modules/jquery/dist/jquery.js',
    './node_modules/slick-carousel/slick/slick.js',
    './node_modules/picturefill/picturefill.js',
    './node_modules/swipebox/src/js/jquery.swipebox.js',
    './node_modules/moment/min/moment.min.js',
    './node_modules/jquery-pjax/jquery.pjax.js',
    jsPath + '/info-pane.js',
    jsPath + '/base.js'], 'web/assets_static/js/base.js');

When I load the page, I get this error.

base.js:15708 Uncaught TypeError: Cannot read property 'defaults' of 
undefined
at HTMLDocument.<anonymous> (base.js:15708)
at mightThrow (base.js:3583)
at process (base.js:3651)

The line for this is :

$.pjax.defaults.timeout = 25000;

...so it appears that the base js file is for some reason not seeing the pjax file - even though it's in the webpack.mix.js.

I'm tearing what little hair I have left out at this one - any help gratefully received. :-).

Upvotes: 1

Views: 1609

Answers (1)

evgeni fotia
evgeni fotia

Reputation: 4810

Past this code instead. You have an additional slash in the jsPath and basePath check the last two line you are adding another slash to them

let mix = require('laravel-mix');  
let basePath = 'app/Resources/assets/sass';  //you have here an additional slash 
let jsPath = 'app/Resources/assets/js';  //and here to
mix.setPublicPath('./web');  
mix.browserSync({proxy: 'rooms.test', ghost: false});
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');
mix.sass(basePath + 'base.scss', 'web/assets_static/css');

mix.combine(['./node_modules/imagesloaded/imagesloaded.pkgd.js',
    './node_modules/jquery/dist/jquery.js',
    './node_modules/slick-carousel/slick/slick.js',
    './node_modules/picturefill/picturefill.js',
    './node_modules/swipebox/src/js/jquery.swipebox.js',
    './node_modules/moment/min/moment.min.js',
    './node_modules/jquery-pjax/jquery.pjax.js',
    jsPath + '/info-pane.js',
    jsPath + '/base.js'], 'web/assets_static/js/base.js');

Upvotes: 1

Related Questions