无法从BrowserWindow页面导入电子模块 [英] unable to import electron modules from the BrowserWindow page
问题描述
我有，我有装入电子BrowserWindow一个angular2 /打字稿应用。此模块通过SystemJS装载。但是，当我通过发射电子运行它，我从SystemJS装载机在那里试图加载从文件系统的电子模块的错误。没有人有任何建议，因为我需要SystemJS映射以使其可以找到电子模块进行配置？我没有看到任何的js，以映射到电子 - prebuilt。
更新
增加了main.js内容和错误跟踪。我使用maxogden的菜单栏推出我的code。所以主要过程是从Javascript来了，那就是在BrowserWindow加载页面是打字稿。
的index.html
＆LT; HTML和GT;
＆LT; HEAD＆GT;
＆LT;标题＆GT; IR工具箱＆LT; /标题＆GT;
＆LT; META NAME =视口CONTENT =WIDTH =设备宽度，初始规模= 1＆GT;
＆LT;链接rel =stylesheet属性HREF =LIB / NG2材料/距离/ NG2-material.css＆GT;
＆LT;链接rel =stylesheet属性HREF =LIB / NG2材料/距离/ font.css＆GT;＆LT;！ - 1.装入库 - ＆GT;
＆LT;脚本SRC =LIB / angular2-polyfills.js＆GT;＆LT; / SCRIPT＆GT;
＆所述; SCRIPT SRC =LIB / system.src.js＆GT;＆下; /脚本＆GT;
＆所述; SCRIPT SRC =LIB / Rx.js＆GT;＆下; /脚本＆GT;
＆所述; SCRIPT SRC =LIB / angular2.dev.js＆GT;＆下; /脚本＆GT;
＆所述; SCRIPT SRC =LIB / router.dev.js＆GT;＆下; /脚本＆GT;
＆所述; SCRIPT SRC =LIB / http.dev.js＆GT;＆下; /脚本＆GT;＆LT;！ - 2.配置SystemJS - ＆GT;
＆LT;脚本＆GT;
System.config（{
图：{
NG2材料'：'./lib/ng2-material
}，
包：{
应用：{
格式为：注册，
defaultExtension：'JS'，
}，
NG2材料：{
defaultExtension：'JS'
}
}
}）;
System.import（应用程序/主）
。然后（NULL，console.error.bind（控制台））;
＆LT; / SCRIPT＆GT;
＆LT; /头＆GT;＆LT;！ - 3显示应用程序 - ＆GT;
＆LT;身体GT;
＆LT;应用＆GT;加载...＆LT; /应用＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
electron.service.ts
有问题的模块编译罚款与打字稿编译器。
进口{}注射从'angular2 /核心;
进口{} ipcRenderer从'电子';@Injectable（）
出口类ElectronService {
放弃（） {
ipcRenderer.send（MB-应用'，'退出'）;
}
}
main.js
常量ipcMain =要求（'电子'）ipcMain。
const的菜单栏=要求（'菜单栏'）;常量APPPATH = __dirname;常量配置= {
openDevTools：真实，
标题：工具箱
};常量MB =菜单栏（{
导演：APPPATH，
指数：APPPATH +/index.htm」明明，
}）;如果（config.openDevTools）{
mb.on（'后，创建窗口'，（）=＆GT; {
mb.window.openDevTools（）;
}）;
}//退出当所有窗口都关闭。
mb.app.on（窗口全封闭'，（）=＆GT; {
如果（process.platform！='达尔文'）{
mb.app.quit（）;
}
}）;//当电子完成此方法将被调用
//初始化并准备创建浏览器窗口。
mb.app.on（'准备好'，（）=＆GT; {
mb.tray.setToolTip（config.title）; mb.app.allowNTLMCredentialsForAllDomains（真）; ipcMain.on（MB-应用，（事件，ARG）=＆GT; {
如果（ARG ===跳槽）{
的console.log（'再见！'）;
mb.app.quit（）;
}
}）;
}）;
错误跟踪
获取文件：/// D：/工程/电子/ IR-工具箱/距离/电子网:: ERR_FILE_NOT_FOUND
fetchTextFromURL @ system.src.js：1085
（匿名函数）@ system.src.js：1646Z
oneAwarePromise @ angular2-polyfills.js：580
（匿名函数）@ system.src.js：1645
（匿名函数）@ system.src.js：2667
（匿名函数）@ system.src.js：3239
（匿名函数）@ system.src.js：3506
（匿名函数）@ system.src.js：3888
（匿名函数）@ system.src.js：4347
（匿名函数）@ system.src.js：4599
（匿名函数）@ system.src.js：337
ZoneDelegate.invoke @ angular2-polyfills.js：322Z
one.run @ angular2-polyfills.js：218
（匿名函数）@ angular2-polyfills.js：567
ZoneDelegate.invokeTask @ angular2-polyfills.js：355Z
one.runTask @ angular2-polyfills.js：254
drainMicroTaskQueue @ angular2-polyfills.js：473
angular2-polyfills.js：322错误：错误：错误XHR加载文件：/// D：/工程/电子/ IR-工具箱/距离/电子（...）ZoneDelegate.invoke @ angular2-polyfills.js：322Z
one.run @ angular2-polyfills.js：218
（匿名函数）@ angular2-polyfills.js：567
ZoneDelegate.invokeTask @ angular2-polyfills.js：355
Zone.runTask @ angular2-polyfills.js：254
drainMicroTaskQueue @ angular2-polyfills.js：473
ZoneTask.invoke @ angular2-polyfills.js：425
我工作的解决方案，围绕由主进程中运行前pressJS从在通过XHR渲染过程中，code运行处理通信。所以，现在的渲染过程永远不需要直接访问电子模块。
I have a angular2/typescript application that I am having loaded into the electron BrowserWindow. The modules for this are loaded via SystemJS. But, when I run it via launching electron, I get an error from the SystemJS loader where it is trying to load the electron module from the file system. Does anyone have any recommendation as what I need to configure in SystemJS to map it such that it can find the electron module? I did not see any js to map to in electron-prebuilt.
Update Added the main.js content and the error trace. I am using maxogden's menubar to launch my code. So the main process is coming from Javascript, and the page that is loaded in the BrowserWindow is in TypeScript.
index.html
<html>
<head>
<title>IR Toolbox</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="lib/ng2-material/dist/ng2-material.css">
<link rel="stylesheet" href="lib/ng2-material/dist/font.css">
<!-- 1. Load libraries -->
<script src="lib/angular2-polyfills.js"></script>
<script src="lib/system.src.js"></script>
<script src="lib/Rx.js"></script>
<script src="lib/angular2.dev.js"></script>
<script src="lib/router.dev.js"></script>
<script src="lib/http.dev.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
map: {
'ng2-material': './lib/ng2-material'
},
packages: {
app: {
format: 'register',
defaultExtension: 'js',
},
'ng2-material': {
defaultExtension: 'js'
}
}
});
System.import('app/main')
.then(null, console.error.bind(console));
</script>
</head>
<!-- 3. Display the application -->
<body>
<app>Loading...</app>
</body>
</html>
electron.service.ts
The module in question compiles fine with the typescript compiler.
import {Injectable} from 'angular2/core';
import {ipcRenderer} from 'electron';
@Injectable()
export class ElectronService {
quit() {
ipcRenderer.send('mb-app', 'quit');
}
}
main.js
const ipcMain = require('electron').ipcMain;
const menubar = require('menubar');
const appPath = __dirname;
const config = {
openDevTools: true,
title: 'Toolbox'
};
const mb = menubar({
dir: appPath,
index: appPath + "/index.html",
});
if (config.openDevTools) {
mb.on('after-create-window', () => {
mb.window.openDevTools();
});
}
// Quit when all windows are closed.
mb.app.on('window-all-closed', () => {
if (process.platform != 'darwin') {
mb.app.quit();
}
});
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
mb.app.on('ready', () => {
mb.tray.setToolTip(config.title);
mb.app.allowNTLMCredentialsForAllDomains(true);
ipcMain.on('mb-app', (event, arg) => {
if (arg === "quit") {
console.log('goodbye!');
mb.app.quit();
}
});
});
Error Trace
GET file:///D:/projects/electron/ir-toolbox/dist/electron net::ERR_FILE_NOT_FOUND
fetchTextFromURL @ system.src.js:1085
(anonymous function) @ system.src.js:1646Z
oneAwarePromise @ angular2-polyfills.js:580
(anonymous function) @ system.src.js:1645
(anonymous function) @ system.src.js:2667
(anonymous function) @ system.src.js:3239
(anonymous function) @ system.src.js:3506
(anonymous function) @ system.src.js:3888
(anonymous function) @ system.src.js:4347
(anonymous function) @ system.src.js:4599
(anonymous function) @ system.src.js:337
ZoneDelegate.invoke @ angular2-polyfills.js:322Z
one.run @ angular2-polyfills.js:218
(anonymous function) @ angular2-polyfills.js:567
ZoneDelegate.invokeTask @ angular2-polyfills.js:355Z
one.runTask @ angular2-polyfills.js:254
drainMicroTaskQueue @ angular2-polyfills.js:473
angular2-polyfills.js:322 Error: Error: XHR error loading file:///D:/projects/electron/ir-toolbox/dist/electron(…)ZoneDelegate.invoke @ angular2-polyfills.js:322Z
one.run @ angular2-polyfills.js:218
(anonymous function) @ angular2-polyfills.js:567
ZoneDelegate.invokeTask @ angular2-polyfills.js:355
Zone.runTask @ angular2-polyfills.js:254
drainMicroTaskQueue @ angular2-polyfills.js:473
ZoneTask.invoke @ angular2-polyfills.js:425
I worked around the solution by running ExpressJS from the main process to handle communication from the code running in the renderer process via XHR. So now the renderer process never needs to access the electron module directly.
这篇关于无法从BrowserWindow页面导入电子模块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
