React project automatically export components by filename

Question

I'm working on a fairly large project using react/webpack with a lot of components. Currently my folder structure looks like this:

bin/
media/
src/
  components/
    login/
      Login.js
      LoginContainer.js
    registration/
    index.js
    ..
  framework/
  redux/
  ..
static/
test/

And in src/components/index.js I do the exports: export Login from ./Login/Login so that in other components I can just do import {Login, LoginContainer} from 'components' without having to search the file location.

Is there a way to not have the exports in the index.js like now? I'd like to export automatically all javascript files by their name, without having to type it every time.

Answer 1

You can add (all of) your Components-SubFolders to your webpack.config.resolve and just import the Filename. Or just add the components root to resolve.modulesDirectories and import the Path relative to the components-folder.