How to use external scss or css file with material UI? (react)-CodePudding

I am facing problem with external css files on my react project. I am using material UI components. In the react components folder I created css file for each components but they are not loading when i hard reload the site.

I wanted to use external css rather than styled components or material ui style syntax.

CodePudding user response：

Just import the css / scss file in your component and make sure you've added the classes for the elements.

CodePudding user response：

If you are looking a more generic option you can import your style.css file in your main App.jsx (if you call it "App.jsx") file. Then you just use the className and will have access to your css.

App.jsx file

import './style.css'; // Your path to your style.css    

function App() {
  return (
    <div>React app</div>
  );
}

export default App;