Application entry file does not exist in Electron Builder

Question

I have a minimal electron app and I am trying to build it (it runs fine). My package.json is

  "main": "main.js",
  "scripts": {
    "start": "electron -r babel-register .",
    "package": "build --dir",
    "postinstall": "electron-builder install-app-deps"
  },
  // dependencies
  "build": {
    "appId": "com.karmadust.mancuspianconvert",
    "files": [
      "node_modules/**/*"
    ],
    "directories": {
      "buildResources": "assets"
    }
  }

When I run npm run package I get:

Application entry file "main.js" in the "[path-to-project]/dist/mac/myapp.app/Contents/Resources/app.asar" does not exist. Seems like a wrong configuration.

Panhandle

Answer 1

You need to first build the main electron, you can use electron-webpack for that:

package.json

"scripts": {
    "compile": "electron-webpack",
    "build": "yarn compile && electron-builder" // Compile main first
  },
"electronWebpack": {
    "commonSourceDirectory": "common",
    "main": {
      "sourceDirectory": "main" // The main folder
    },
    "renderer": {
      "sourceDirectory": null // Ignore any renderer build
    },
 }

It will create a main folder inside your dist with the main.js build-in.

You can take a look at Electron webpack documentation for more information.

Blastopore

Answer 2

@Marcelo is right about needing to compile & build your source files. But I'd caution you against electron-webpack because it's become unreliable

Checkout these boilerplates for some other options, many of which use electron-builder under the hood

Geis

Answer 3

1st you need to build your electron application with production. You can use the standard ng build command e.g.

ng build yourApp --configuration production

Or if you only have 1 project and working in root

ng build --configuration production

Now you should have your built code in your dist folder. e.g.

dist/yourApp

Or your application will just be in dist folder

Now in package.json you need to specify your electron entry file in your built code. If your entry file is called main.js

IN package.json:

"main": "dist/yourApp/main.js"

Teniacide