Is there any way to load styles conditionally?

kriasoft / isomorphic-style-loader

CSS style loader for Webpack that is optimized for isomorphic (universal) web apps.

https://reactstarter.com

MIT License

1.27k stars 144 forks source link

Is there any way to load styles conditionally? #191

Open matheenpasha opened 3 years ago

matheenpasha commented 3 years ago

We have isomorphic react rendering for our application. We are trying to implement dark/light themes using user preferences. Is there any way we can load light.scss or dark.scss based on a flag/variable?

Any help is appreciated. Thanks.

"css-loader": "^2.1.1" "isomorphic-style-loader": "^5.1.0"

maurocen commented 3 years ago

Why don't you use the prefers-color-scheme: dark media query as explained in this article? I think it's a better solution and it seems to be supported by most of all popular browsers

If you want to load styles conditionally because of data transfer restrictions, then I don't know 😅 but I'd use a HOC to specify the desired styles before rendering.