4 ms·
This is the goal of Web Components / Shadow DOM. Angular implements a polyfill for this. Every angular component has 3 files html, ts, (s)css, and the styles i
by itslennysfault 8y ago
This is the goal of Web Components / Shadow DOM.
Angular implements a polyfill for this. Every angular component has 3 files html, ts, (s)css, and the styles in the components css file are automatically scoped to just the component they apply to. It takes away all the stress of global css selectors, and if you want to share styles you can just have a library of shared styles and import them via scss. It's honestly heavenly and I haven't thought about conflicting selectors in years.
- exogen 8y agoI'm aware and agree, and it also – even if less so than other solutions like Styled Components – counts as CSS-in-JS. So welcome to enjoying CSS-in-JS :)
- deadwisdom 8y agoOr use Polymer/LitElement, where it's just all in one file... I swear people are just reinventing react methods to eventually get to where Web Components have been for the past 4 years.
- exogen 8y agoReact is greater than 4 years old, and people mostly use it for the nice authoring experience, not to dick around with CSS isolation problems.
- deadwisdom 8y agoYou don't have to "dick around" with CSS isolation problems with web-components, it just works. React is where you are dicking around.