Rag*_*hav 53 javascript jquery node.js atom-editor electron
我正在使用Electron制作桌面应用.在我的应用程序中,我正在加载一个外部站点(Atom应用程序外部),可以说http://mydummysite/index.html页面.
这是Atom编辑器中我的应用程序的结构:
即它有以下部分:
源代码:
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中缺少一些依赖吗?
我已经尝试过的:
这是在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确保提供绝对路径.
评论的答案:
我得到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的或类似的环境,提供内部
module和module.exports,你得到的是一个工厂,而不是实际的jQuery对象.
现在使用该工厂(通过从CDN导入代码或如果您在本地可以使用npm模块),您将需要以下内容:
<script>
window.jQuery = window.$ = require('jquery');
</script>
Run Code Online (Sandbox Code Playgroud)
我写了一篇文章解释了Node + jQuery的组合.
用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
| 归档时间: |
|
| 查看次数: |
56061 次 |
| 最近记录: |