在Angular 2和Webpack中加载电子模块

Question

I'm using this starter kit to create an electron application. 我正在使用这个入门工具包来创建电子应用程序。 When i try to import electron modules into an Angular 2 component like this: 当我尝试将电子模块导入这样的Angular 2组件中时：

const electron = require('electron');

I get this error fs.readFileSync is not a function from this file in the starter kit: 我收到此错误fs.readFileSync is not a function入门工具包中此文件fs.readFileSync is not a function ：

var fs = require('fs')
var path = require('path')

module.exports = path.join(__dirname, fs.readFileSync(path.join(__dirname, 'path.txt'), 'utf-8'))

when i do not use require in the component, everything works fine. 当我不在组件中使用require时，一切正常。 It's like using require changes the type of require used elsewhere but i really don't know what's happening. 这就像使用require改变的类型require在其他地方使用，但我真的不知道发生了什么。 I've tried other ways of importing electron modules into the angular component but i get: 我尝试了将电子模块导入角组件的其他方法，但得到了：

Cannot find module 'electron'.

Answer 1

Electron requires NodeJS the browser can't access the filesystem only the server can. Electron要求NodeJS，浏览器仅服务器可以访问文件系统。

But Electron renders the index.html file using node so using the following will work with your Angular app. 但是Electron使用node渲染index.html文件，因此使用以下内容将可用于Angular应用程序。

In your index.html file for Angular you should place 在Angular的index.html文件中，您应该放置

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

An example using other parts of Electron in your Angular app. 在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 2和Webpack中加载电子模块

问题描述

1 个解决方案

解决方案1
0 2016-12-12 07:36:42

在Angular 2和Webpack中加载电子模块

问题描述

1 个解决方案

解决方案1 0 2016-12-12 07:36:42

解决方案1
0 2016-12-12 07:36:42