Electron: jQuery is not defined

Question

Problem: while developing using Electron, when you try to use any JS plugin that requires jQuery, the plugin doesn\'t find jQuery, even if you load in the correct path using

Answer 1

I face the same issue and this worked for me!

Install jQuery using npm

$ npm install jquery

Then include jQuery in one of the following ways.

Using script tag

<script>window.$ = window.jQuery = require('jquery');</script>

Using Babel

import $ from 'jquery';

Using Webpack

const $ = require('jquery');

Answer 2

You can put node-integration: false inside options on BrowserWindow.

eg: window = new BrowserWindow({'node-integration': false});

Answer 3

A better and more generic solution IMO:

<!-- Insert this line above script imports  -->
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>

<!-- normal script imports etc  -->
<script src="scripts/jquery.min.js"></script>    
<script src="scripts/vendor.js"></script>    

<!-- Insert this line after script imports -->
<script>if (window.module) module = window.module;</script>

Benefits

• Works for both browser and electron with the same code
• Fixes issues for ALL 3rd-party libraries (not just jQuery) without having to specify each one
• Script Build / Pack Friendly (i.e. Grunt / Gulp all scripts into vendor.js)
• Does NOT require node-integration to be false

source here

Answer 4

1.Install jQuery using npm.

npm install jquery --save

2.

<!--firstly try to load jquery as browser-->
<script src="./jquery-3.3.1.min.js"></script>
<!--if first not work. load using require()-->
<script>
  if (typeof jQuery == "undefined"){window.$ = window.jQuery = require('jquery');}
</script>

Answer 5

<script>
  delete window.module;
</script>

before your jquery import and you're good to go. more info here.

Answer 6

ok, here's another option, if you want a relative include...

<script> window.$ = window.jQuery = require('./assets/scripts/jquery-3.2.1.min.js') </script>