Search code examples
javascriptjqueryvue.jsparceljs

Uncaught ReferenceError: jQuery is not defined VueJS Parcel

I have this:

import jQuery from 'jquery'
import HSCore from './components/assets/js/hs.core.js'

Yet I still get this: 

 Uncaught ReferenceError: jQuery is not defined
    at Object.parcelRequire.client/components/assets/js/hs.core.js (hs.core.js:177)

Why 😑

import jQuery from 'jquery' does actually import jQuery (via console.log(jQuery)), but my other JS file is having problems accessing it(?). This is in a Vue file using Parcel loader.

hs.core.js file: 

(function ($) {
...

})(jQuery); //<-- line 177
Solution

  • This will do it:

    const { $, jQuery } = require('jquery');
global.$ = $;
global.jQuery = jQuery;

require( './components/assets/js/hs.core.js');//<-- this made it work with all the above code too

// $ object now exists:  $(“#el”)
// jQuery now exists:  jQuery(“#el”)