Importing JavaScript files with the same name as directory they're inside

Let me suggest you the following structure I personally like:

Your component tree structure (As an example every component has a different folder structure. It is up to you to keep it clean and tidy. Index.jsx in components folder just normalizes access to those components whoever needs them):

src/components/
    Butter/
        Butter.jsx
        index.jsx
    Beets/
        Beets.jsx
    Cabbage/
        index.jsx
    Meat.jsx
index.jsx

Content of components/index.jsx

export Butter from './Butter/index.jsx';
export Beets from './Beets/Beets.jsx';
export Cabbage from './Cabbage/index.jsx';
export Meat from './Meat.jsx';

Some container Borscht.jsx somewhere else in your project which uses those components

import {
    Beets,
    Cabbage,
} from 'src/components';