Unable to import CSS file into React Project

I’ve just started using React for a change, and I’ve encountered an error that I can’t seem to solve.

Everything works fine except that no matter what I do, React keeps throwing ‘Can’t resolve ./src/style.css‘ or ‘None of these files exist: ./src/style.css.

My project structure is pretty strait forward:

App
    .expo
    .expo-shared
    assets
    node_modules
    src
        components
        screens
        style.css
    App.js

    ~everything else

My App.js contains this statement: import './src/style.css';

I’ve also tried require('./src/style.css'); but it doesn’t work either.

Pretty sure I’m missing something humorously silly but still any help would be highly appreciated.

Thanks a lot in advance!

Answer

I can see that you have .expo in your folder so I am assuming that you are using react-native.

For react native you have to style your component with StyleSheet and you won’t be able to use *.css file.

check react-native styling documentation here: https://reactnative.dev/docs/style