Question

我正在尝试将jquery功能添加到用电子编写的桌面应用程序中使用电子快速启动repo我将下载的jquery文件添加到main.html文件中，如下所示：

<script> require("./jquery.min.js"); </script>

左右：

<script>window.$ = window.jQuery = require('./jquery.min.js');</script>

然后在index.js文件中我在createWindow函数中添加代码，因为这似乎是正确的位置，但说实话，我尝试的任何地方或多或少都会得到同样的错误。

mainWindow.$为undefined，同样适用于BrowserWindow和app

mainWindow在createWindow函数中定义如下： mainWindow = new BrowserWindow({width: 800, height: 600})

和BrowserWindow在文件的顶部声明如下： const BrowserWindow = electron.BrowserWindow

知道我哪里出错了，我应该更改/添加哪些声明？

提前致谢

Answer 1

在使用电子时，还会在DOM中插入一些其他符号，从而导致出现问题。因此，您可以使用jquery，如下所示

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js" onload="window.$ = window.jQuery = module.exports;"></script>

注意“onload”中的代码。

Answer 2

当你在require或主要进程内拨打index.js时，它正在寻找节点模块。所以你需要通过npm安装jQuery并将其保存为你的apps package.json文件中的依赖项。

npm install jquery --save

然后你的index.js理论上应该使用

看到它

let $ = require('jquery');
mainWindow.$ = $;

请参阅Node.JS section for installing jQuery。这就是电子使用的。

-

OLD ANSWER

在main.html内，只需包含JavaScript，就像传统的JS文件一样。

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

Answer 3

要将jQuery集成到您的 Electron应用程序中，请按照以下简单步骤操作

步骤1：在终端中运行

npm install jquery --save

步骤2：将此行添加到您的angular.json或angular-cli.json文件中

 "build": {
        "options": {
            "styles": [
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "src/styles.css"
            ],
            "scripts": [
              "node_modules/jquery/dist/jquery.js", //add this line
              "node_modules/bootstrap/dist/js/bootstrap.min.js"
            ],
...
...
     }
  }

第3步：最后将这一行添加到您的index.html文件中

 <!-- Need this for jQuery electron -->
  <!-- Insert this line above script imports  -->
  <script>if (typeof module === 'object') {
    window.module = module;
    module = undefined;
  }</script>

  <!-- Insert this line after script imports -->
  <script>if (window.module) module = window.module;</script>
</head>

您也可以使用此template

将jQuery集成到电子应用程序中

3 个答案: