Kann Lieferanten Dateien nicht finden mit Hilfe von Elektron mit angular2 und angular-cli

Question

Ich habe eine Probe Held App (die App im Schnellstart) mit eckigen-Cli, und es funktioniert wie beabsichtigt.

npm start kommt mit meiner App, funktioniert wie vorgesehen.

Allerdings scheint das Starten der App in Elektron kläglich zu versagen. Für das Leben von mir scheint nicht herauszufinden, warum das Elektron nicht in der Lage ist, die Ordner zu finden, die in dist/ enthalten sind.

I.e. mein dist/ Verzeichnis hat die folgenden:

Allerdings, wenn ich starten electron dist/ (die index.js die Elektronenhauptdatei enthält), die Konsole gibt der folgende:

Failed to load resource: net::ERR_FILE_NOT_FOUND 
file:///vendor/systemjs/dist/system.src.js Failed to load resource: 

Aber klar in sie das Verzeichnis vendor/, da meine npm start korrekt funktioniert.

Mein index.js ist so ziemlich eine Kopie von den ersten Schritten:

const electron = require('electron'); 
// Module to control application life. 
const {app} = electron; 
// Module to create native browser window. 
const {BrowserWindow} = electron; 

// Keep a global reference of the window object, if you don't, the window will 
// be closed automatically when the JavaScript object is garbage collected. 
let win; 

function createWindow() { 
    // Create the browser window. 
    win = new BrowserWindow({width: 800, height: 600}); 

    // and load the index.html of the app. 
    win.loadURL(`file://${__dirname}/index.html`); 


    // Emitted when the window is closed. 
    win.on('closed',() => { 
    // Dereference the window object, usually you would store windows 
    // in an array if your app supports multi windows, this is the time 
    // when you should delete the corresponding element. 
    win = null; 
    }); 
} 

// This method will be called when Electron has finished 
// initialization and is ready to create browser windows. 
// Some APIs can only be used after this event occurs. 
app.on('ready', createWindow); 

// Quit when all windows are closed. 
app.on('window-all-closed',() => { 
    // On OS X it is common for applications and their menu bar 
    // to stay active until the user quits explicitly with Cmd + Q 
    if (process.platform !== 'darwin') { 
    app.quit(); 
    } 
}); 

app.on('activate',() => { 
    // On OS X it's common to re-create a window in the app when the 
    // dock icon is clicked and there are no other windows open. 
    if (win === null) { 
    createWindow(); 
    } 
}); 

// In this file you can include the rest of your app's specific main process 
// code. You can also put them in separate files and require them here. 

Answer 1

Um Ihre Anwendung zu erhalten mit der Datei zu arbeiten: // Protokoll, müssen Sie Folgendes tun:

Innen von src/index.html, die folgende Zeile wie folgt ändern:

von:

<base href="/"> 

Um

<base href="./"> 

Hoffnung, das hilft.

BEARBEITEN: Auch vergessen zu erwähnen: Wenn Sie Ihre App sowohl online als auch offline ausführen, möchten Sie möglicherweise eine Art von Erkennung verwenden, so dass Sie zurück zur/Basis wechseln können, wenn die App in einem ausgeführt wird normales Browserfenster, über HTTP.

Answer 2

Mit der neuesten Winkel-cli-Version, müssen Sie die Basis href Pfad als Argument für den ng build-Befehl übergeben, statt sie in der Datei index.html zu ändern:

ng build --base-href . 

Hoffe, es hilft.