I am in nightmare mode with my commercial app, Evidentia.
Working on release 4, I have a complicated infrastructure that doesn’t always play well together: Angular 8+ and nwjs.
Over the last few days I have spent WAY too much time trying to get the configurations right – time I would rather be spending building application code.
Why is it so complex?
The Cause of Complexity
The cause of this complexity is multi-fold, and I have to keep that in mind while I am troubelshooting.
- Is it a Typescript issue?
- Is it a webpack issue?
- Is it an Angular CLI issue?
- Is it a Nodejs issue?
- Is it a dependency issue?
- Is it an nwjs issue?
- Is it an Angular 8+/nwjs compatability issue?
I use native Node packages in my application, which knocks me out of using ‘ng serve’ and other CLI tools to develop and test. nwjs also introduced require() and commonjs module handling, which makes it a backend application.
This combination is not ‘ordinary’ so many (most?) of the various examples in the either don’t work for me. trying to explain the setup to helpful peers is difficult because of this. I get a lot of “why are you doing THAT”?
What’s the Problem?
So let me try to go through the list.
- it’s is very seldom (never?) and nwjs issue. I don’t say that cynically. I have no examples.
- it’s sometimes a dependency issue, but those are usually resolved easily. e.g. my testing packages got out of sync.
- it’s seldom a Node issue, though I need to remember sometimes that is the underlying framework.
That means it is usually either an Angular/nwjs compatability issue or…
Angular…Angular…Angular…
Why, Angular?
Typescript – it adds value but also obfuscates issues. e.g. How many times do I need to figure out why an import isn’t importing, or if I have the right target for the build? OK, it comes with experience, but it adds complexity.
Webpack – it is probably unfair to blame Angular for this, but Angular CLI obfuscates the webpack configuration, so yes I blame them. This is frequently the issue. For example, when trying to build an Angular element, webpack is reversing my style sheet order.
Angular – the real issue here is that I am either using cutting edge features (Angular Elements?) have issues with styling hierarchy (it is not always as documented) or something doesn’t work the way I think it should. e.g. trying to open a component in a new window.
More on my hassle opening windows in a later post.
Complain, complain
I actually like Angular. I like Node and nwjs as well. I am just frustrated that I have to spend so much time troubleshooting the build process instead of creating new application features.
My jury is out on Typescript (isn’t it obsolete?). My issue with webpack is really an issue with Angular CLI – why take a complex tool and obfuscate the configuration? “Transparency, transparency, transparency…”