How do I set up an environment with parcel where each component has it's own, compartmentalized, SCSS style file that do not interfere with each other (E.G. you can even have the same class names in two files and they won't apply to both elements on your Webapp that use it, each component will receive it's designated one.)
I've seen this done before in an angular 4 project and I know it used to be possible with webpack : https://javascriptplayground.com/css-modules-webpack-react/
but I'd like to accomplish this with parcel instead.
I've followed this guide :
https://www.valentinog.com/blog/tutorial-react-parcel-bundler/
to set up Parcel-React. (for Scss that's just a personal preference I'm already using it since it's ridiculously easy to set up in parcel but this question could just as easily have applied to css)
this oughta do it : https://medium.com/@kswanie21/css-modules-sass-in-create-react-app-37c3152de9
it's a step by step guide using the npm package "css-modules" as well as "node-sass".