How to integrate Electron ipcRenderer into Angular 2 app based on TypeScript?

Question

I want to use ipcMain / ipcRenderer on my project to communicate from Angular to Electron and back.

The Electron side is pretty clear:

const
  electr         


        

Answer 1

Component.TS

const ipc = require('electron').ipcRenderer;

@Component({
    selector: 'app-my component',.....
})

....

 public testElectronIpc(): void{
        ipc.send('test-alert');
    }

MAIN.JS

// IPC message listeners
ipc.on('test-alert', function (event, arg) {
    console.log('Test alert received from angular component');
})

config

plugins: [ new webpack.ExternalsPlugin('commonjs', [ 'desktop-capturer', 'electron', 'ipc', 'ipc-renderer', 'native-image', 'remote', 'web-frame', 'clipboard', 'crash-reporter', 'screen', 'shell' ]) ],