[英]Uncaught Error: Cannot find module 'jquery'
我正在使用Electron制作桌面应用程序。 在我的应用程序中,我正在加载一个外部站点(在 Atom 应用程序之外)可以说http://mydummysite/index.html页面。
这是Atom Editor中我的应用程序的结构:
即它有以下部分:
main.js
package.json
nodemodules>jquery
(加载jquery)源代码:
主要.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();
});
包.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 )在 Electron shell 中加载,但出现错误
未捕获的错误:找不到模块“jquery”
你能帮我找到这个问题的原因吗?
正如你在我的目录结构截图中看到的,我已经将 jquery 模块安装到我的文件夹中,我是通过npm install jquery
命令完成的。
注意:为了在 JS 中使用require
命令,我尝试在我的外部页面http://mydummysite/index.html页面中添加require("ipc")
并且它正在工作,所以require("jquery")
的原因可能是什么。
我是否在 Electron 中以正确的方式添加了外部模块 (jquery)?
我是否缺少package.json
一些依赖项?
我已经尝试过的:
npm cache clean
, npm install jquery
(到我的应用程序文件夹)npm install --save jquery
npm install jquery -g
npm rebuild
sudo npm install jquery -g
sudo npm install jquery
export NODE_PATH=/usr/local/lib/node_modules
这是在module.js
抛出错误的位置的屏幕截图
有人可以建议为什么require("ipc")
可以工作而require("jquery")
不行吗?
我的目标是将 jQuery 与电子应用程序一起使用,节点集成为 true。
tl;博士
与普通的 nodejs 应用程序相比,您可以访问全局模块(例如位于/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')
这就是为什么您可以访问ipc
、 app
等,但不能访问您使用npm install -g
全局npm install -g
的模块。
我只是用最新的electron-prebuilt
版本尝试了它,本地服务器提供与您提供的完全相同的 HTML 文件,我想我知道问题是什么:如果您没有将路径附加到您的应用程序node_modules
目录下app root 到NODE_PATH
变量它不会工作。 所以你需要做这样的事情:
export NODE_PATH=/PATH/TO/APP/node_modules
electron /PATH/TO/APP
导出NODE_PATH
,请确保提供绝对路径。
评论的答案:
我得到 jQuery not found 错误
是在这张票中找到的。 基本上,如果您使用 jQuery 的 npm 包或在电子内部的 HTML 文件中执行以下操作:
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
你得到的是一个工厂,而不是附加到全局上下文(例如window
)的实际 jQuery 对象。 正如我在之前的回答中提到的(还包含 jQuery 的源代码)
当您在 CommonJS 或提供
module
和module.exports
类似环境中需要 jQuery 时,您得到的是工厂而不是实际的 jQuery 对象。
现在要使用该工厂(通过从 CDN 导入代码,或者如果您有本地可用的 npm 模块),您需要如下内容:
<script> window.jQuery = window.$ = require('jquery'); </script>
我写过一篇文章,解释了 Node + jQuery 的组合。
使用 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>
我在将 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
# assuming you have installed jquery locally instead of globally like in as
npm install jquery -s # without -g flag
而不是require( "jquery" ) ,从源目录给出相对路径
要求( “./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>
我希望下面的链接可以解决您的疑问
为什么 require("ipc") 有效而 require("jquery") 无效?
https://github.com/atom/electron/issues/254
https://discuss.atom.io/t/electron-app-to-host-external-site/16390/7
同样的问题发生在我身上,一个简单的解决方案是将其添加到您的 index.js 文件中:
app.on('ready', function() {
var mainWindow = new BrowserWindow({
"node-integration": false
})
//rest of your initialization code here.
})
该问题是由节点引起的,有关更多信息,请参阅此帖子
将 node-integration 设置为 false 将禁用渲染器进程中的 node.js - 即您的应用程序只能执行 Web 浏览器将执行的操作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.