未捕获错误:找不到模块'jquery'

Rag*_*hav 53 javascript jquery node.js atom-editor electron

我正在使用Electron制作桌面应用.在我的应用程序中,我正在加载一个外部站点(Atom应用程序外部),可以说http://mydummysite/index.html页面.

这是Atom编辑器中我的应用程序的结构:

在此输入图像描述

即它有以下部分:

  1. main.js
  2. 的package.json
  3. nodemodules> jquery(加载jquery)

源代码:

main.js:

   'use strict';

    var app = require('app');

    app.on('ready', function() {
      var BrowserWindow = require('browser-window');

      var win = 
      new BrowserWindow({ width: 800, height: 600, show: false, 
               'node-integration':true });
      win.on('closed', function() {
        win = null;
      });

      win.loadUrl('http://mydummysite/index.html ');
      win.show();
    });
Run Code Online (Sandbox Code Playgroud)

的package.json:

{
  "name": "my-mac-app",
  "version": "5.2.0",
  "description": "My Mac Desktop App",
  "main": "main.js",
  "scripts": {
    "start": "electron ."
  },
  "author": "Me",
  "license": "ISC",
  "dependencies": {
    "jquery": "^2.1.4"
  }
}
Run Code Online (Sandbox Code Playgroud)

外部页面 - http://mydummysite/index.html页面代码:

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <h1>Hello World!</h1>

  </body>
<script>

   var jqr=require('jquery');

</script>
</html>
Run Code Online (Sandbox Code Playgroud)

当我运行上面的应用程序(通过将应用程序文件夹拖动到Electron)时,外部页面(http://mydummysite/index.html)加载到Electron shell中,但出现错误"Uncaught Error:找不到模块'jquery'"

在此输入图像描述

你能帮我找到这个问题的原因吗?

正如您在我的目录结构截图中看到的,我已经将jquery模块安装到我的文件夹中,并通过"npm install jquery"命令完成.

注意:要在JS中使用"require"命令,我尝试在我的外部页面http://mydummysite/index.html页面添加"require("ipc")" 并且它正在工作,因此可能是需要的原因(" jQuery的").

我是否在Electron中以正确的方式添加了外部模块(jquery)?

我在package.json中缺少一些依赖吗?

我已经尝试过的:

  • npm cache clean,npm install jquery(到我的app文件夹)
  • npm install --save jquery
  • npm install jquery -g
  • npm重建
  • sudo npm install jquery -g
  • sudo npm install jquery
  • export NODE_PATH =/usr/local/lib/node_modules

这是在module.js中抛出错误的位置的屏幕截图

在此输入图像描述

有人可以建议为什么要求("ipc")正在工作并且需要("jquery")吗?

我的目标是将jQuery与电子应用结合使用,节点集成为true.

Yan*_*oto 39

TL;博士

与普通的nodejs app相比,您可以访问全局模块(例如,位于其中/usr/bin/node),电子不会自动设置NODE_PATH环境变量.您必须手动将其设置为包含所需模块的所有路径.


更新:

这个问题的答案

为什么require("ipc")工作而require("jquery")不是?

可以在本期中找到,说明系统/用户模块不应包含在模块的全局路径中

因为它们可能包含应用程序未附带的模块,并且可能使用错误的v8标头编译.

如果你看看电子的来源,你可以看到内部模块被添加到module.globalPaths:

# Add common/api/lib to module search paths.
globalPaths.push path.resolve(__dirname, '..', 'api', 'lib')
Run Code Online (Sandbox Code Playgroud)

这就是为什么你必须访问ipc,app等等.但不是说你已经安装在全球使用的内存模块npm install -g.


我刚刚尝试使用最新electron-prebuilt版本的本地服务器提供与您提供的完全相同的HTML文件,我想我知道问题所在:如果您没有将路径附加到应用node_modules程序根目录下的应用程序目录中NODE_PATH变量它不会起作用.所以你需要做这样的事情:

export NODE_PATH=/PATH/TO/APP/node_modules
electron /PATH/TO/APP
Run Code Online (Sandbox Code Playgroud)

导出时请NODE_PATH确保提供绝对路径.


更新2:

评论的答案:

我得到jQuery未找到错误

是在这张票中找到的.基本上,如果您使用jQuery的npm包或在电子内部的HTML文件中执行以下操作:

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
Run Code Online (Sandbox Code Playgroud)

你得到的是一个工厂,而不是附加到全局上下文的实际jQuery对象(例如window).正如我在之前的回答中提到的(也包含jQuery的源代码)

当您需要的jQuery一个CommonJS的或类似的环境,提供内部modulemodule.exports,你得到的是一个工厂,而不是实际的jQuery对象.

现在使用该工厂(通过从CDN导入代码或如果您在本地可以使用npm模块),您将需要以下内容:

<script>
  window.jQuery = window.$ = require('jquery');
</script>
Run Code Online (Sandbox Code Playgroud)

我写了一篇文章解释了Node + jQuery的组合.


Dam*_*ien 7

用npm安装jquery是不够的:

npm install --save jquery
Run Code Online (Sandbox Code Playgroud)

它恢复了项目中jQuery的源文件.但是你必须在你的html文件中包含脚本:

<!DOCTYPE html>
<html>
  <head></head>

  <body>
      <h1>Hello World!</h1>
  </body>

  <!-- Try to load from cdn to exclude path issues. -->
  <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

  <script>
     window.jQuery = window.$ = jQuery;

     $(document).ready(function() {
         console.log( "jQuery is loaded" );
     });
  </script>

</html>
Run Code Online (Sandbox Code Playgroud)


小智 6

我在将 jQuery 与电子一起使用时遇到了同样的问题,并为这些情况找到了解决方案:

<script type="text/javascript" src="js/jquery.min.js"
 onload="window.$ = window.jQuery = module.exports;" ></script>
Run Code Online (Sandbox Code Playgroud)

来源:https : //discuss.atom.io/t/electron-app-to-host-external-site/16390/9