Currently I’m working on a private project with Angular 2 (v.2.0.0-beta.0 | TypeScript), Electron (Atom Shell) and NodeJS.
I had some issues with Angular 2 and webpack modular bundler.
In my system I have to transcode all the TypeScript code with all the nice features to normal JavaScript-code (ES5).
first issue
- It took me many hours to get the InterProcess Comunication from the Electron to the NodeJS running. The Problem is that the IPC-module is a native Electron-module and webpack is trying to find it in the node_modules folder.
StackOverflow issue
Solution: webpack-target-electron-renderer
You have to change/update your webpack config. After that webpack will ignore or find the native Electron-modules.
second issue
- In Angular 2 you can write components, services, …. and more. I wanted to use a service to get data from one component to another but I never got the data exchanged between them.
Solution: In my case I used the Componenttag “providers” to create an instance of the declared service but every time you write “providers” with a service in it, you are creating a new instance of the service and you will never get data from one component to another. You start your app with that
bootstrap(App, ['services']);
since then you have an instance of the provided services. To use them, you only have to import the service and to write in the somponent-constructor
constructor( %varname% : %servicename% )
conclusion:
The combination of Angular 2 (TypeScript), Electron (Atom Shell) and NodeJS is very nice. With that components you are able to build a client application rapidly. My next “nice to have” is to integrate a CSS-preprocessor (SASS, LASS, …) in my projects to write CSS-code in the ways of a programmer.