使用Angular 2 with Electron(Angular CLI)

Question

我使用新的Angular CLI生成了一个新的Angular 2项目.现在我不想在浏览器中使用Angular,而是在电子应用程序中使用.因此,我为电子主要过程创建了一个文件,ng build在终端中构建我的Angular应用程序后,该应用程序无法正常工作.

电子主要过程的文件:

var electron = require("electron");
var {app, BrowserWindow} = electron;

app.on('ready', () => {
    var mainWindow = new BrowserWindow();
    mainWindow.loadURL(`file://${__dirname}/dist/index.html`);
});

DevTools出错:

file:///vendor/es6-shim/es6-shim.js Failed to load resource: net::ERR_FILE_NOT_FOUND
file:///vendor/reflect-metadata/Reflect.js Failed to load resource: net::ERR_FILE_NOT_FOUND
file:///vendor/systemjs/dist/system.src.js Failed to load resource: net::ERR_FILE_NOT_FOUND
file:///vendor/zone.js/dist/zone.js Failed to load resource: net::ERR_FILE_NOT_FOUND
index.html:22 Uncaught ReferenceError: System is not defined

我也知道你基本上需要一个Web服务器来运行Angular 2应用程序,我认为我的应用程序不起作用,因为Electron通过file://协议加载应用程序.

但我真的想将Electron与Angular 2结合使用; 所以我的问题是,如果这是可能的,如果是这样,我需要如何从cli实用程序修改生成的角度模板.

Answer 1

你也可以改变

<base href="/">

至

<base href="./">

Answer 2

在昨天阅读了有关Angular 2路由器的内容之后,我发现问题是由于这条线引起的 index.html

<base href="/">

通过用动态设置的基础替换它,一切都按预期工作.

<script>document.write('<base href="' + document.location + '" />');</script>