require('jquery') not defined using elixir / Gulp

Question

I'm using elixir and I can't get to work any JS using JQuery I keep getting this :

var jQuery = require('jquery'); //Uncaught ReferenceError: require is not defined

Here is my elixir function:

elixir(function(mix) {
    mix.sass('app.scss');
    mix.copy('node_modules/font-awesome/fonts', 'public/fonts');
    mix.copy('node_modules/bootstrap-sass/assets/fonts', 'public/fonts');
    mix.copy(['node_modules/bootstrap-sass/assets/javascripts/bootstrap.js',
                'node_modules/jquery/dist/jquery.js',
                'node_modules/jquery-ui/jquery-ui.js',
                'node_modules/fullcalendar/node_modules/moment/moment.js',
                'node_modules/fullcalendar/dist/fullcalendar.js',
                'node_modules/fullcalendar/dist/gcal.js',
                'node_modules/dropzone/dist/dropzone.js',
                'node_modules/jquery-datetimepicker/jquery.datetimepicker.js'
            ], 'resources/assets/js/vendors');
    mix.copy('resources/assets/js/vendors/jquery.js', 'public/js');
    // mix.copy('resources/assets/js/vendors/jquery-ui.js', 'public/js');
    // mix.copy('resources/assets/js/vendors/bootstrap.js', 'public/js');
    mix.scripts(['vendors/jquery-ui.js',
                'vendors/bootstrap.js',
                'vendors/contentflow.js',
                'vendors/qTip/jquery.qtip.min.js',
                'vendors/moment.js',
                'vendors/fullcalendar.js',
                'vendors/dropzone.js',
                'vendors/jquery.datetimepicker.js'
            ], 'public/js/vendors.js');
    mix.scripts(['date-time-pickers.js',
                'main.js',
                'search-page.js',
                'social.js',
                'booking-picker.js'
            ], 'public/js/app.js');
});

Any idea what happens? Tried

mix.browsesify

but it would return

[Laravel Elixir] Browserify Failed!: Cannot find module 'moment'``

Thanks for your help!

score 0 · Answer 1 · answered Apr 13 '18 at 10:36

It looks like the warning Uncaught ReferenceError: require is not defined is something your IDE says because it doesn't understand how these scripts work together. (I get this warning a lot when working with javascript in Laravel Elixir).

The real problem is the missing of the moment module. It looks like this package is not installed (correctly). You can try to reinstall it (npm install --save moment) or remove the node_modules folder and run npm install again.

Take a look at https://momentjs.com/ for more information about this package. Including a small installation guide for other package managers besides npm.

Disclaimer. I am not sure if this is the solution for you. In my experience, solving npm/Laravel Elixir problems can be a hassle sometimes. I do not have all the information I need to make sure this solves the problem. It would be nice if you could include the contents of the package.json file or maybe paste a error log from npm. Just let me know.

require('jquery') not defined using elixir / Gulp

1 Answers1