首页 文章

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

提问于
浏览 次
50

我正在使用Electron来制作桌面应用 . 在我的应用程序中，我正在加载一个外部站点（在Atom应用程序之外）让我们说http://mydummysite/index.html页面 .

以下是Atom Editor中我的应用程序的结构：

enter image description here

即它有以下部分：

  • main.js

  • package.json

  • 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();
    });

的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"
  }
}

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

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

  </body>
<script>

   var jqr=require('jquery');

</script>
</html>

当我运行上面的应用程序（通过将应用程序文件夹拖动到Electron）外部页面（http://mydummysite/index.html）加载电子shell但错误 "Uncaught Error: Cannot find module 'jquery'"

enter image description here

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

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

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

我是否在Electron中以正确的方式添加了外部模块（jquery）？

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

What I have already tried:

  • 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中抛出错误的位置的屏幕截图

enter image description here

有人可以建议为什么要求（“ipc”）正在工作并且需要（“jquery”）吗？

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

javascript jquery node.js atom-editor electron

6 回答

  • 3

    使用jQuery和电子时遇到同样的问题，并找到解决方案案件：

    <script type="text/javascript" src="js/jquery.min.js"
 onload="window.$ = window.jQuery = module.exports;" ></script>

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

    回复于
  • 2

    同样的问题发生在我身上，一个简单的解决方案是将它添加到index.js文件中：

    app.on('ready', function() {
      var mainWindow = new BrowserWindow({
        "node-integration": false
      })
//rest of your initialization code here.
})

    问题是由节点引起的，有关更多信息，请参阅此 post

    将node-integration设置为false将禁用渲染器进程中的node.js - 即您的应用程序只能执行Web浏览器的操作 .

    回复于
  • 37

    tl;dr

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

    Update:

    这个问题的答案

    为什么要求（“ipc”）工作且需要（“jquery”）不？

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

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

    如果您看一下electron's source，您可以看到内部模块已添加到 module.globalPaths ：

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

    这就是为什么你有权访问 ipc ， app 等，而不是你使用 npm install -g 全局安装的模块 .

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

    export NODE_PATH=/PATH/TO/APP/node_modules
electron /PATH/TO/APP

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

    Update 2:

    评论的答案：

    我得到jQuery未找到错误

    在this ticket中找到 . 基本上，如果您使用jQuery的npm包或在电子内部的HTML文件中执行以下操作：

    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

    你得到的是一个工厂，而不是附加到全局上下文的实际jQuery对象（例如 window ） . 正如我在previous answer中提到的（也包含jQuery的源代码）

    当你在CommonJS或提供模块和module.exports的类似环境中需要jQuery时，你得到的是工厂而不是实际的jQuery对象 .

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

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

    我写了一个解释Node jQuery组合的article .

    回复于
  • 0

    用npm安装jquery是不够的：

    npm install --save jquery

    它恢复了项目中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>
    回复于
  • 7
    # assuming you have installed jquery locally instead of globally like in as
npm install jquery -s         # without -g flag

    而不是require（“jquery”），从源目录require（“./ node_modules / jquery / dist / jquery.min.js”）中提供相对路径;

    请尝试以下方法：

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

    要么

    <script>var $ = jQuery = require('./node_modules/jquery/dist/jquery.min.js');</script>
    回复于
  • 2

    我希望以下链接可以为您提供一些疑问

    为什么要求（“ipc”）工作且需要（“jquery”）不？

    https://github.com/atom/electron/issues/254

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

    回复于

相关问题