Cześć!
Mam mały problem z aplikacją angularową opakowaną Electronem. O ile udało mi się bez większych trudności uruchomić podstawowy projekt o tyle mam problem podczas odświeżania. Wyświetla mi się błąd:
(node:22340) electron: Failed to load URL: file:///C:/repos/angular-electron/dist/angular-electron/ with error: ERR_FILE_NOT_FOUND
I tak - widzę oczywiście, że ma jakiś problem ze ścieżkami i taki był też na samym początku ale poprawiłem podczas budowania baseUrl i aplikacja normalnie się uruchamia. Problem pojawia się dopiero jak odświeżę przez ctrl+R.
Tutaj kawałek mojej konfiguracji:
"name": "angular-electron",
"author": "Author",
"description": "sample project",
"version": "0.0.0",
"main": "main.js",
"scripts": {
"ng": "ng",
"start-web": "ng serve",
"start": "electron-forge start",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test",
"electron": "electron",
"electron-build": "ng build --base-href ./ && npm run electron --trace-warnings .",
"package": "electron-forge package",
"make": "electron-forge make"
},
"private": true,
main.js:
const {app, BrowserWindow} = require('electron')
const url = require("url");
const path = require("path");
let mainWindow
function createWindow () {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
})
mainWindow.loadURL(
url.format({
pathname: path.join(__dirname, `/dist/angular-electron/index.html`),
protocol: "file:",
slashes: true
})
);
// Open the DevTools.
mainWindow.webContents.openDevTools()
mainWindow.on('closed', function () {
mainWindow = null
})
}
app.on('ready', createWindow)
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') app.quit()
})
app.on('activate', function () {
if (mainWindow === null) createWindow()
})
Drzewo z wynikiem budowania:
Index.html (widać poprawiony base href):
<!doctype html>
<html lang="en" data-critters-container>
<head>
<meta charset="utf-8">
<title>AngularElectron</title>
<base href="./">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="styles.ef46db3751d8e999.css"></head>
<body>
<app-root></app-root>
<script src="runtime.4da1346d407a9b33.js" type="module"></script><script src="polyfills.561062d69280f423.js" type="module"></script><script src="main.98e824e32420cf23.js" type="module"></script></body>
</html>
Electron Forge buduje mi .exe który zachowuje się identycznie - uruchamia się prawidłowo ale po odświeżeniu nic się nie pojawia. Poniżej screeny z odpalonej apki -> w terminalu vscode nie ma żadnych błędów dopóki nie odświeżę.
Będę wdzięczny za jakiekolwiek wskazówki bo to wygląda na ewidentny problem ze ścieżkami ale objawia się on bardzo dziwnie skoro za pierwszym uruchomieniem aplikacji wszystko jest w porządku.
Pozdrawiam,
Dawid.
