如何使用角度cli导入角度2中的电子 [英] How to import Electron in angular 2 using angular cli

问题描述

我正在尝试使用Angular 2(配置了基于最新的基于webpack的angular cli)为gui开发Electron应用程序的原型，但由于无法在我的angular2组件中导入Electron api，我陷入了困境.具体来说，我希望能够通过单击ui中的按钮来打开一个新的BrowserWindow ...因此:

I'm trying to prototype an Electron app using Angular 2 (configured with the latest webpack-based angular cli) for the gui, but I'm stuck since I don't get how to import Electron api in my angular2 components. Specifically I want to be able to open a new BrowserWindow at the click on a button in the ui... so:

<button type="button" (click)="openNewWindow()">
    open
</button>

以及在我的组件中:

openNewWindow() {
      let appWindow = new BrowserWindow({width: 800, height: 600});
      appWindow.loadUrl('http://www.google.com');
  }

但是...如何导入BrowserWindow?！

but... how can I import BrowserWindow?!

使用:

import { BrowserWindow } from 'electron';

我收到无模块错误"，并遵循以下问题的答案: Webpack无法找到模块电子" 我得到:

I get a "no module error" and by following the answer to this question: Webpack cannot find module 'electron' I get:

syntax error near unexpected token ( var electron = require('./')

我该怎么办?

ps.通过在没有BrowserWindow导入的情况下运行"electron ."即可使应用正常运行

ps. by running "electron ." without the BrowserWindow import the app is working properly

推荐答案

运行命令npm install electron @types/electron 然后使用

import { ipcRenderer } from 'electron'.

如果遇到任何问题，请尝试运行npm eject，将生成一个webpack.config.js，并在module.exports顶部添加"target":"electron-renderer"

If you run into any problems, try to run npm eject, a webpack.config.js will be generated, add "target": "electron-renderer" at the top of module.exports

这篇关于如何使用角度cli导入角度2中的电子的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！