How to import a hosted css in to react component?

Question

I have a .css file that is hosted online. How can I import it in to my react component?

import mystyles from 'https://www.myserver.com/styleguide/latest/css/mystyles.min.css';

this results in an error

Module not found: Error: Can't resolve 'https://www.myserver.com/styleguide/latest/css/mystyles.min.css' in '/Users/busda001/code/electrode-app/src/client/components'

Answer 1

You have 2 choices to include CSS in your react project,

First, you can put the link in the main HTML project page which has all react project.

Second importing in your file.jsx as you do now, but you nee in this way CSS loader in your server, if you use webpack.config.js use this link to learn what should you do,

How to include a CSS from bower_components using webpack dev server?