如何将Electron ipcRenderer集成到基于TypeScript的Angular 2应用程序中？ [英] How to integrate Electron ipcRenderer into Angular 2 app based on TypeScript?

问题描述

我想使用 ipcMain / ipcRenderer 在我的项目中，从Angular到Electron并返回。

I want to use ipcMain / ipcRenderer on my project to communicate from Angular to Electron and back.

电子方面非常明确：

const
  electron = require('electron'),
  ipcMain = electron.ipcMain,
;

ipcMain.on('asynchronous-message', function(event, arg) {
  console.debug('ipc.async', arg);
  event.sender.send('asynchronous-reply', 'async-pong');
});

ipcMain.on('synchronous-message', function(event, arg) {
  console.debug('ipc.sync', arg);
  event.returnValue = 'sync-pong';
});

但我不知道如何将Electron模块集成到我的Angular 2应用程序中。我使用 SystemJS 作为模块加载器，但我是新手。

But I have no idea how to integrate that Electron module into my Angular 2 app. I use SystemJS as module loader, but I'm a rookie with it.

任何帮助表示赞赏。谢谢。

Any help appreciated. Thanks.

---马里奥

推荐答案

存在冲突，因为 Electron 使用 commonjs 模块解析，但您的代码已使用 systemjs 规则进行编译。

There is conflict, because Electron use commonjs module resolving, but your code already compiled with systemjs rules.

两种解决方案：

稳健的方式。注册对象要求返回：

<script>
    System.set('electron', System.newModule(require('electron')));
</script>

这是最好的，因为 renderer / init.js 脚本在启动时加载该模块。 SystemJS必须只接受它，而不是加载。

This is the best, because renderer/init.js script loads that module on start. SystemJS have to take it only, not loads.

替代方式。使用带有声明的脏技巧。

Alternative way. Use dirty trick with declaration.

获取电子实例 index.html ：

<script>
    var electron = require('electron');
</script>

以这种方式在 typescript 文件中声明它：

Declare it inside your typescript file this way:

declare var electron: any;

自由使用）

electron.ipcRenderer.send(...)

这篇关于如何将Electron ipcRenderer集成到基于TypeScript的Angular 2应用程序中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！