Uncaught Error: Bootstrap's JavaScript requires jQuery at bootstrap.min.js:6, in an electron app
Question
I have built an electron app that uses Angular framework. Inside 'index.html' file I load bootstrap and jquery. But after electron app is built using electron-packager. I see this error.
Uncaught Error: Bootstrap's JavaScript requires jQuery
at bootstrap.min.js:6
From previous answers to this question I ensured jquery is loaded first and then the bootstrap. But still I see this error
For ref I have attached the index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Demo App</title>
<base href="./">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
<body>
</body>
</html>
But If I run the same as web app in browser, I don't see this error. Note: As you see in the index.html, I am using CDN for jquery and bootstrap.
Any thoughts or suggestion would really be appreciated.
2 answers
solution1
2 ACCPTED 2020-07-31 13:01:27
Instead of using the CDN library, I'd like to recommend using the jQuery npm package on Electron.
npm install jquery
<script>
window.$ = window.jQuery = require("jquery");
</script>
solution2
0 2020-11-16 07:02:44
Add the bellow script in your html file:
<!-- Insert this line above script imports -->
<script>
if (typeof module === 'object') { window.module = module; module = undefined; }
</script>
Then add scripts:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
then add the bellow:
<!-- Insert this line after script imports -->
<script>if (window.module) module = window.module;</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.