這是一個已知的問題。這是因爲JQuery自動感知node.js的存在--Electron向瀏覽器添加了一個node.js上下文,因此JQuery會感到困惑。
最好的方法是通過NPM安裝了jQuery,使用electron-rebuild
然後改變你的HTML文件看起來像:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>My Electron App</title>
<link href="stylesheets/main.css" rel="stylesheet" type="text/css">
<link href="./node_modules/bootstrap/dist/css/bootstrap.css" rel="stylesheet" type="text/css">
<script src="helpers/context_menu.js"></script>
<script src="helpers/external_links.js"></script>
</head>
<body>
<div class="container">
<h1 id="greet"></h1>
<p class="subtitle">
Welcome to <a href="http://electron.atom.io" class="js-external-link">Electron</a> app running on this magnificent <strong id="platform-info"></strong> machine.
</p>
<p class="subtitle">
You are in <strong id="env-name"></strong> environment.
</p>
<div class="jumbotron">
<h1>Bootstrap Test</h1>
<p>
Some content that should be in a Bootstrap "jumotron" box.
If it isn't, check your html code to make sure that the Bootstrap css is loaded.
Also check the dev console in the app to look for errors.
</p>
</div>
</div>
<script>window.$ = window.jQuery = require('jquery');</script>
<script src="app.js"></script>
</body>
</html>
這是一個標準的樣板,但與特殊的JQuery裝載機腳本和app.js裝載機移動在此之後,如果您在正常的應用程序腳本中需要使用jQuery進行任何操作 - 例如,加載Twitter Bootstrap現在可以通過使用npm來安裝引導程序,執行electron-rebuild
,然後在您的app.js中使用此腳本:
import bootstrap from 'bootstrap';