在angular2组件中需要节点模块 [英] Require node module in angular2 component

问题描述

我不知道如何在我的angular2组件中要求使用节点模块，尤其是在我如何打开angular2组件中的新电子窗口的情况下。

I can not figure out how to require node modules in my angular2 components - especially in my case on how to open a new electron window within an angular2 component.

我的component.html具有类似的内容

My component.html has something like this

<button class="btn btn-success" (click)="buttonLoginClick()">Login</button>

在component.ts中，我使用以下内容

And within the component.ts I use the following

export class LoginComponent  {
  constructor() {}

  buttonLoginClick(): void {
    alert("just a test");

    const remote = require('electron').remote;
    const BrowserWindow = remote.BrowserWindow;

    var win = new BrowserWindow({ width: 800, height: 600 });
    win.loadURL('./test.html');
  }
}

编译错误是

找不到名称'require'。

Cannot find name 'require'.

推荐答案

我知道这个问题是两个月前提出的。但是，由于某些关键字在Google上的排名很高。我会解释一下它是如何工作的...

I know the question's been asked over two months ago. But, since this is ranking quite high on Google for some keywords. I'll explain how I got it working...

在您的 index.htm 文件在 head 元素内添加以下块

In your index.htm file add the following block inside the head element

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

然后，您可以在任何Typescript文件中声明电子变量，例如组件...

Then you can declar the electron variable inside any Typescript file, for example, a component...

import { Component } from "@angular/core";

declare var electron: any;

@Component({
    ...
})
export class FooComponent {
    bar() {
        var win = new electron.remote.BrowserWindow({ width: 800, height: 600 });
        win.loadURL('https://google.com.au');
    }
}

调用该函数时，它将打开一个电子窗口，指向google

when you called that function, it'll open an electron window pointing to google

此选项应该更简洁一些。如果您有 src\typings.d.ts 文件。然后，您可以简单地告诉打字稿编译器注册 require 全局函数...

This option should be a bit cleaner. If you have a src\typings.d.ts file. Then you can simply tell the typescript compiler to register the require global function...

declare var require: any;

然后您可以按照需要使用 require 函数通常会

And then you can use the require function as you'd normally do

这篇关于在angular2组件中需要节点模块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！