Question

在电子上加载jquery时遇到问题。

问题仅存在于我放置的main.js上

mainWindow.loadURL('http://localhost:3000/menu');

我发回menu.html

然而，当我使用这个方法时，Jquery工作正常

 mainWindow.loadURL('ile://' + __dirname + '/menu.html');

我需要使用localhost工作。

Answer 1

这是一个已知问题。这是因为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安装bootstrap，执行electron-rebuild，然后在你的app.js中使用它：

import bootstrap from 'bootstrap';

Electron App Jquery模块未加载

1 个答案: