Add angular-cli

[area73]

Is it posible to add angular-cli? Does it make sense?

[colinskow]

I am contributing to this starter, specifically because angular-cli doesn't have enough flexibility to do what I want to do. It may make sense for generating components / services / pipes etc. but not for the build process.

[area73]

That's what I though it make sense for generating components, service etc. I give it a try and works fine with angular-cli to generate the above files, so any one who wants to use angular-cli it's a matter of only installing the dependency :)

[Css-IanM]

I dont think you even need it as a dep, you can install it globally and still just use it for generation.

[colinskow]

If you would like to provide instructions and an example in the README for how to generate components with angular-cli (including a working config file) then I would welcome a pull request.

[okonon]

@colinskow is there a way to serve angular code in a browser ?

[colinskow]

@okonon this project is specific to Electron and does not support browsers. I recommend https://github.com/AngularClass/angular-starter

[Kaffiend]

I'm working on a more cli oriented electron seed. I'm still working on integrating more convenient features such as HMR (in progress) but i have live-reload and everything is proxy-ed around the cli and uses the cli build process for all angular code. So far i have not yet had to eject the underlying webpack. This seed can be found here https://github.com/Kaffiend/electron-angular-ngrx

Edit: Update!! Angular hosted HMR ng serve -hmr done.

[colinskow]

I definitely want to integrate CLI. Ideally without having to eject. But the Electron main process needs traditional Webpack. I won't get to it for at least a few weeks, so PRs welcome!

[Kaffiend]

I'm not as familiar as i'd like to be. What caveats of electron's main process require traditional webpack? Part of the reason im building this seed from scratch is to force myself to learn all the in and outs 😄

[colinskow]

@Kaffiend there are two separate builds in this starter: 1) Main Electron process is compiled from TypeScript and minified through Webpack. This won't be changed and is incredibly simple. Just look at the config file. 2) Renderer process is compiled through Webpack. We want to switch this process over to angular-cli. Ideally we can figure out how to integrate CLI into our Electron dev server without having to eject the config.

[Kaffiend]

1.) Ok I think I’m good there, I’m compiling my electron with a gulp task with the typescript plugin. 2.) I use a gulp task to wrap the cli command to build to dist on live reload workflow. Which is has a proxy with browsersync to the dist directory for angular code. a. on HMR workflow I wrap that command in a task as well, and on completed compilation (monitoring cli’s stdout stream) I reverse proxy browsersync to cli’s serve address.

Ian Mackie Lead Developer Complete System Support, Inc.

From: Colin Skow Sent: Wednesday, January 10, 2018 12:06 AM To: colinskow/angular-electron-dream-starter Cc: Ian Mackie; Mention Subject: Re: [colinskow/angular-electron-dream-starter] Add angular-cli (#9)

@Kaffiend there are two separate builds in this starter:

1. Main Electron process is compiled from TypeScript and minified through Webpack. This won't be changed and is incredibly simple. Just look at the config file.
2. Renderer process is compiled through Webpack. We want to switch this process over to angular-cli. Ideally we can figure out how to integrate CLI into our Electron dev server without having to eject the config. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[colinskow]

@Kaffiend it looks like your approach will work. I'd prefer not to use gulp, so let's write a script that simply uses promises to accomplish the same.

[colinskow]

Although I see how Gulp makes things a lot easier to probably best to leave it. The one thing to add is to automatically restart Electron when source files for the main process are updated.

[Kaffiend]

I agree I would prefer to use pure node scripts. I don't like the extra abstraction layer and reliance on plugin authors. I was curious about the viability of gulp4 and it's new parallel features.

On Jan 10, 2018 12:40 AM, "Colin Skow" notifications@github.com wrote:

@Kaffiend https://github.com/kaffiend it looks like your approach will work. I'd prefer not to use gulp, so let's write a script that simply uses promises to accomplish the same.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/colinskow/angular-electron-dream-starter/issues/9#issuecomment-356505345, or mute the thread https://github.com/notifications/unsubscribe-auth/AHdrNRDbdGaVv18GBYXdQWjCXDHn-mbpks5tJE03gaJpZM4OsiX0 .

[Kaffiend]

I have no problem refactoring gulp out. Nodemon manages the electron process restarts on changes with a gulp watcher compiling it's source changes

On Jan 10, 2018 12:47 AM, "Ian Mackie" kaffiend0311@gmail.com wrote:

I agree I would prefer to use pure node scripts. I don't like the extra abstraction layer and reliance on plugin authors. I was curious about the viability of gulp4 and it's new parallel features.

On Jan 10, 2018 12:40 AM, "Colin Skow" notifications@github.com wrote:

@Kaffiend https://github.com/kaffiend it looks like your approach will work. I'd prefer not to use gulp, so let's write a script that simply uses promises to accomplish the same.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/colinskow/angular-electron-dream-starter/issues/9#issuecomment-356505345, or mute the thread https://github.com/notifications/unsubscribe-auth/AHdrNRDbdGaVv18GBYXdQWjCXDHn-mbpks5tJE03gaJpZM4OsiX0 .

[Kaffiend]

For now i'm going to keep gulp, as you said it does make things easier. But at the first hiccup of upstream packages hindering updates and progression I wont hesitate to yank it out 😺

[Kaffiend]

@colinskow I've got all three development build processes lined out now. Had an issue with the task completion launching the electron too soon before the cli was done serving up the HMR and you had to reload manually once it finished. gulp also suppresses STDOUT on wrapped commands to the CLI so i piped those through to display the CLI build stats and completion messages. This was also the case with the electron main process, so i piped it as well. Console logs where suppressed which could be confusing if you didnt know what was going on.

[Kaffiend]

So i've had some challenges to overcome with the CLI, external modules and render target. This required ejection. I wish there was a way around it but I've yet to find a viable one. Internally we have it up and running with HMR on an ejected project while using external modules. I will update our parallel seed this weekend with the solution we came up with as well as some more progress on the baseline of the seed for examples.

[Kaffiend]

@colinskow I've updated the seed i linked above to eject from the CLI, added native module support, and updated to support HMR workflow with the ejected CLI.

[colinskow]

@Kaffiend What issue were you running into that forced you to eject the project?

[Kaffiend]

setting the target so that i could have access to native modules.