Sometimes, it's necessary to write a bunch of React components in one file. Ideally, that's not how it's done, but sometimes (and for some people) this isn't feasible in the initial steps of writing code. Most code I've seen handles styles in one of the following ways:

Way #1

const style = {
    element: { /* ... */ },
    anotherElement: { /* .... */}
};

const MyComponent = props => {
    return <>
        <div style={style.element} />
        <div style={style.anotherElement} />
    </>;
}

Way #2

read more...