yaxx
yaxx

Reputation: 655

angular-electron app not launching and automatically exiting

am trying to set up angular 6 and electron 2.0 project app. after all dependencies were installed and running npm run electron-build the app is build successfully and the dist folder was generated but the app is automatically exiting without launching. here is the package.json file

{
"name": "front",
"version": "0.0.0",
"main": "main.js",
"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "electron": "electron .",
    "electron-build":"ng build --prod"
}

and here is the main.js file

const {app,BrowserWindow} = require('electron');
let win;
function createWindow (){
  win = new BrowserWindow({
    height: 700,
    width:1200,
    backgroundColor:'#ffffff'
  })
  // win.once('ready-to-show', ()=>{win.show()})
  win.loadURL(`file://${__dirname}/dist/index.html`)

    win.on('closed',function(){
    win=null;
  })
}

app.on('ready',createWindow)

app.on('windows-all-closed',()=>{
  if(process.platform!=='darwin'){
    app.quit();
  }

})
app.on('activate',function(){
  if(win==null){
    createWindow()
  }
})

Upvotes: 2

Views: 1544

Answers (2)

yaxx
yaxx

Reputation: 655

oops, i actually got it, am suposed to be using

win.loadURL(`file://${__dirname}/dist/front/index.html`)

instead of:

win.loadURL(`file://${__dirname}/dist/index.html`)

because after building the app,electron generated a dist folder containing "front/index.htlm" where "/front" is the root of my project so it works as expected by running npm run electron-build then npm run electron

Upvotes: 1

Tomasz Błachut
Tomasz Błachut

Reputation: 2507

I don't really know why your app doesn't launch but even if it would Angular won't work properly with file:// protocol. Stuff like routing for example. I recommend electron-serve. It's very small library and works like a charm.

const {app,BrowserWindow} = require('electron');
const serve = require('electron-serve');

const loadURL = serve({directory: 'dist'});

let win;
function createWindow (){
  win = new BrowserWindow({
    height: 700,
    width:1200,
    backgroundColor:'#ffffff'
  })
  loadURL(win);

  win.on('closed',function(){
    win=null;
  })
}

app.on('ready',createWindow)

app.on('windows-all-closed',()=>{
  if(process.platform!=='darwin'){
    app.quit();
  }

})
app.on('activate',function(){
  if(win==null){
    createWindow()
  }
})

Upvotes: 0

Related Questions