I would like to have a setup with Angular 4, Webpack & HMR.
The part I care about the most is actually style substitution. I did some homework and was not able to find a working solution so far.
Just to check: Does anyone have an out-of-the-box solution for this?
If not then I guess I will need to understand the topic more:
1) What is the algorithm that Angular is using for assigning component specific attributes to css?
2) Is there any API in Angular (it's JavaScript, so I don't mind if it's public or implementation detail/"hidden") that would allow me to reload/substitute the styles for a given component? I did some research on HMR and if such API exists or it's doable then I would love to try & use it.
3) Please verify if my assumptions are true: From the technical perspective this shouldn't be too difficult - Angular (at least in my setup) loads all the styles as <style>
tags - if I'm not mistaken one per component type.
If that is all true then it shouldn't be a big of a deal to find the correct <style>
tag & replace it's content with what I'm getting from Webpack HMR.
The only problem would be to apply the isolation - compile the css & apply the [__ngSomething] attributes in there.