How to package an electron app / frontend / API together

[daiky00]

I have the following folder structure

I was wondering how can I deploy this into an electron app installer all together can somebody please tell me what are the steps necessary to make this happen?

Important note: The API works in local machine doesn't need to be online.

@bennymeg Your help will be greatly appreciated

[bennymeg]

1. In your angular.json or worksapce .json file, at your electron app build options, add an additionalEntryPoints entry to your api folder so it will be compiled alongside your electron & web apps.
2. In your electron app project, you can use child_process.spawn (or any other method you prefer) to spawn a new node process with your api, using a relative path to the main.js from your electron app (note that the relative paths between your apps in the app folder should be the same as your relative paths to the builds in the dist folder).
3. Build your project.
4. In your package or maker options, add an extraFiles entry to account for copying over the directory with your compiled api into the final build.
5. Package your project.

[daiky00]

if there anything you can see that is wrong from the code above let me know please!

[bennymeg]

It should be something like that (just outside the if statement), probably the path is incorrect.

1. Verify that the API is being built.
2. Write down the path and the file name of the API.
3. Spawn the API with the correct path.
4. Repeat steps 1-3 for the packaged application.

[daiky00]

@bennymeg the API is been built correctly but I put it in a way that it doesn't compile inside the electron app folder by changing additionalEntryPoints in the electron build options instead it builds in it is own folder image below. Now for the path are you saying I should put something like ../app/sayf-identify-api/main.js ?

"additionalEntryPoints": [
          {
            "entryName": "../sayf-identity-api/main",
            "entryPath": "apps/sayf-identity-api/src/main.ts"
          }
        ],

[daiky00]

@bennymeg I change it to this and is not working.

Note: apiAppName = 'sayf-identity-api'

 private static loadMainWindow() {
    // load the index.html of the app.
    const pathAPI =   `../${apiAppName}/main.js`;
    spawn('node', [pathAPI], { shell: true });
    if (!App.application.isPackaged) {
      App.mainWindow.loadURL(`http://localhost:${rendererAppPort}`);
    } else {
      App.mainWindow.loadURL(
        format({
          pathname: join(__dirname, '..', rendererAppName, 'index.html'),
          protocol: 'file:',
          slashes: true,
        })
      );
    }
  }

[daiky00]

@bennymeg any help would be much appreciated