问题:在使用Electron进行开发时,当你尝试使用任何需要jQuery的JS插件时,插件都找不到jQuery,即使你使用脚本标签加载在正确的路径中。

例如,

<body>
<p id="click-me">Click me!</p>
...
<script src="node_modules/jquery/dist/jquery.min.js"></script> //jQuery should be loaded now
<script>$("#click-me").click(() => {alert("Clicked")});</script>
</body>

运行上面的代码是行不通的。实际上,打开DevTools,转到Console视图,然后单击<p>元素。你应该看到函数$没有定义或者类似的效果。


当前回答

使用yarn安装jquery

yarn add jquery

其他回答

我用电子构建和Angular应用程序,我的解决方案如下:

index . html

<script>
    if ( typeof module === "object" && typeof module.exports === "object" ) {
      window.$ = window.jQuery = require('jquery');
    }
</script>

angular.json

"scripts": [
              "node_modules/jquery/dist/jquery.min.js",
              "node_modules/popper.js/dist/umd/popper.min.js",
              "node_modules/bootstrap/dist/js/bootstrap.min.js"
            ]

Jquery从angular加载。Json如果在浏览器上,否则如果它是一个电子构建的应用程序,它将需要模块代替。

如果你想在index.html中导入jquery,而不是从angular. html中导入。Json使用以下解决方案:

<script src="path/to/jquery"></script>
<script>
    if ( typeof module === "object" && typeof module.exports === "object" ) {
      window.$ = window.jQuery = require('jquery');
    }
</script>

我想我理解你的挣扎,只是解决方法有点不同。我使用脚本加载器为我的js文件,其中包括jquery。脚本加载器需要你的js文件,并将其附加到你的vendor.js文件的顶部,它为我做了魔法。

https://www.npmjs.com/package/script-loader

安装脚本加载程序后,将其添加到引导或应用程序文件中。

进口“脚本!路径/ your-file.js”;

另一种书写<script>window的方式。$ = window。jQuery = require('./path/to/ jQuery ');</script>是:

<script src="./path/to/jquery" onload="window.$ = window.jQuery = module.exports;"></script>

您可以尝试以下代码:

mainWindow = new BrowserWindow({
        webPreferences: {
            nodeIntegration:false,
        }
});

电子常见问题解答:

http://electron.atom.io/docs/faq/

我不能使用jQuery/RequireJS/Meteor/AngularJS在电子。 由于Electron的Node.js集成,有一些额外的 插入DOM的符号,如module, exports, require。这 属性会导致一些库出现问题,因为它们想插入 名称相同的符号。 要解决这个问题,你可以在Electron中关闭节点集成: //在主进程中。

let win = new BrowserWindow({  
 webPreferences: {
 nodeIntegration: false   } });

但如果你想保留使用Node.js和Electron的能力 api,在包含之前,必须重命名页面中的符号 其他库:

<head> 
<script> 
window.nodeRequire = require; 
delete window.require;
delete window.exports; delete window.module; 
</script> 
<script type="text/javascript" src="jquery.js"></script> 
</head>