Electron Angular2（angular-cli）需要内部模块失败答案

【问题标题】：Electron Angular2(angular-cli) require internal module failedElectron Angular2（angular-cli）需要内部模块失败
【发布时间】：2017-03-20 01:14:44
【问题描述】：

我的渲染器进程中不需要内部模块。当我想要内部节点模块甚至电子时，我得到一个错误或未定义或空对象。

例如：

import * as fs from 'fs';
console.log(fs) // empty object

import { spawn } from 'child_process'; // Can't find child_process module

import * as electron from 'electron' // fs.readFileSync is not a function

这是我的代码：电子

import { app, BrowserWindow } from 'electron';
let mainWin = null;
const loadURL = `http://localhost:4200`;
const createWindow = () => {
    mainWin = new BrowserWindow({
        width: 800,
        height: 800
    });
    mainWin.loadURL(loadURL);
    mainWin.on('closed', () => {
        mainWin = null;
    });
}
app.on('ready', createWindow);
app.on('activate', () => {
    if (!mainWin) {
        createWindow();
    }
});

和渲染器处理Angular代码：

import { Component } from '@angular/core';
import { readdirSync } from 'fs';
import { spawn } from 'child_process';
console.log(readdirSync);
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.styl']
})
export class AppComponent {
  constructor() {}
}

我做错了什么？

【问题讨论】：

标签： angular typescript electron angular-cli

【解决方案1】：

您在 Angular 中包含用于浏览器的服务器端模块。

Electron 需要 NodeJS，浏览器无法访问文件系统，只有服务器可以。

但 Electron 使用 node 渲染 index.html 文件，因此您可以通过 index.html 文件要求 electron

在您的 Angular 应用中使用 Electron 部分的示例。

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>Angular App</title>
  <base href="./">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">


</head>
<body>
  <app-root></app-root>


  <script>
    window.electron = require("electron");
    window.ipcRenderer = require("electron").ipcRenderer;
    window.electronRemote = require("electron").remote;
  </script>


</body>
</html>

【讨论】：

我想这取决于您的构建系统，有些非常限制。我发现这是使用 angular-cli 构建使用电子的最无错误的方式。
那缺少的类型呢？