0

I found a similar question here:
Uncaught TypeError: $(...).select2 is not a function
But that's not for Electron (here is another question with Electron without solution: https://github.com/select2/docs/issues/17), and the solution is to check if jQuery is loaded twice.

How can I check if i'm loading jQuery twice?
Actually I think this is a generic problem for libraries in Electron when we use "nodeIntegration=true" in our window, because we need to add some hacks:

This is my code: 

<script>
    window.$ = window.jQuery = require('jquery'); 
    window.Popper = require('popper.js').default;
    window.Bootstrap = require('bootstrap');
    dt = require( 'datatables.net-bs4' )(window, window.$);
    require( 'datatables.net-fixedheader-bs4' )(window, $);
    //require( 'datatables.net-select-bs4' )(window, $);
</script>

<script src="../../js/select2.min.js"></script>

Can you see all those ugly hacks? anyway, I feel I'm not loading jQuery twice, and even if it is I'm Select2 is added after all the other libraries.
Maybe is because I'm adding as a script instead of using installed module? is not possible to mix them?

UPDATE:
Maybe the problem is in this code from select2.js? 

/*! Select2 4.0.7 | https://github.com/select2/select2/blob/master/LICENSE.md */
!function(a) {
    "function" == typeof define && define.amd ? define(["jquery"], a) : "object" == typeof module && module.exports ? module.exports = function(b, c) {
        return void 0 === c && (c = "undefined" != typeof window ? require("jquery") : require("jquery")(b)),
        a(c),
        c
    }
    : a(jQuery)
}(function(a) {

I don't fully understand what is doing, but seems is checking module.exports, which is true in Electron window with nodeIntegration=true

Enrique
  • 4,693
  • 5
  • 51
  • 71

2 Answers2

0

OK that's the problem, if we use nodeIntegration=true in our Electron window then we need to load the Select2 library using require (not a script tag) in this way: 

require( 'YOUR PATH TO/select2.min.js' )(jQuery);
Enrique
  • 4,693
  • 5
  • 51
  • 71
0

Your solution didn't work for me. That worked:

In renderer/main.js

window.jQuery = window.$ = require('jquery')
import 'select2' // ...import select2 so webpack can pack it...

So easy)

P.S. require('select2') is also ok.

Victor Gorban
  • 1,159
  • 16
  • 30