Skip to content
Advertisement

Switch between two external css files in react

I want to apply an option where user can switch between dark mode and light mode in the application.

JavaScript

I have two sheets for the whole website.

JavaScript

I have given the option but what do i have to do to switch between the two css files?

JavaScript

I used this method and it is updating the link tag perfectly in the head but without importing it to my app using import “../cssf/sheername.css” it is of no use.How can i solve it?

Advertisement

Answer

that’s quite an interesting issue.

For dynamically importing css files into react I’d check this thread: here

However I don’t think this is the best solution, as it is potentially very hard to maintain and not very DRY.

I would rather have 1 css file that looks at the class on body and changes css colors based on that (assuming you don’t change layout, only colors)

Advertisement