ThorstenHans/ngx-electron

Not compatible with Angular Ivy

Opened this issue · 3 comments

Hey,
I think it doesn't work at all at the moment. Angular 16.1.

image

I have no idea how to use fs or path in the Angular with Electron now...

Hey @panyann did you find any resolution?

@kulkarni-sachin Yes, every day learning more... Week ago I was as lost as you. I'm manually using Electron's IPC.

How does it work?
Angular can't use 'fs' or other Node.js modules, but Electron can. That means that in main.js (main electron file) you have access to everything, you just need to send data to that file and use it there.

How to send the data?
You must use IPC to send and receive events between Angular and Electron. Then you can do whatever you want in the main.js.

You can read how it works here:
https://dev.to/michaeljota/integrating-an-angular-cli-application-with-electron---the-ipc-4m18

I additionally use electron-store to save data to json file on disk (still in the main.js). That's why I don't need to use 'fs' directly (I'm lazy when I can).

You can use my service, which I made based on above tutorial:

import { Injectable } from '@angular/core';
import { IpcRenderer } from 'electron';


@Injectable({
  providedIn: 'root'
})
export class IpcService {

  private ipc: IpcRenderer;
  
  constructor() {
    if (window.require) {
      try {
        this.ipc = window.require('electron').ipcRenderer;
      } catch (e) {
        throw e;
      }
    } else {
      console.warn('Electron\'s IPC was not loaded');
    }
  }

  public on(channel: string, listener: any): void {
    if (!this.ipc) {
      return;
    }
    this.ipc.on(channel, listener);
  }

  public send(channel: string, data?: any): void {
    if (!this.ipc) {
      return;
    }
    this.ipc.send(channel, data);
  }

}

Hi,

I forked the project in order to rebuild it with angular-cli 16.2.
Fell free to test it here on npmjs
Sorry in advance if you have issues, it's still in beta.

Requirements :

  • angular >= 16
  • electron >= 13
    Installation :
  • npm uninstall ngx-electron
  • npm i ad-ngx-electron

You will have to adapt your import 'ngx-electron' to 'ad-ngx-electron'.

Hope it helps :-)