Support for dynamically exported components

[jtdman]

Using atomic design and @diegohaz arc boilerplate, you are able to reference components that are located anywhere in the components subdirectories i.e. atoms, molecules, organisms etc. For reference here is the link: https://github.com/diegohaz/arc/wiki/Atomic-Design#do-not-worry
Per the link:
This is possible because all components are dynamically exported on src-example/components/index.js and imported in a way that Atomic Design structure doesn't matter:

import { Input, Label, Field, HomePage, PageTemplate } from 'components'

Has anyone been able to get the same functionality with create-react-app?

I have managed to get rid of the relative paths using .env and specifying NODE_PATH=src but I still have to explicitly include the entire subdirectory structure for the component.

Thanks

[gaearon]

I don't recommend doing this via index.js. It means code splitting won't work because everything ends up in the same bundle.

At Facebook, we use a system called "haste" that lets you import any file by its unique name without relative paths. I'm open to supporting it as an opt-in in CRA projects, but somebody would need to write a Webpack plugin for it. Jest already supports it.

[wtgtybhertgeghgtwtg]

Jest has its own implementation of Haste. I thought Facebook dropped Haste.

[gaearon]

Facebook is actively using Haste in products. I think node-haste is just some old tangentially project. AFAIK the implementation we use is jest-haste-map.

[Secretmapper]

I'm achieving this by ejecting my app and manually resolving 'arc' paths (atoms, molecules, organisms, etc.) into resolve.modules via the web pack config. This makes everything in the 'arc' paths absolute. It does not do the same thing as diegohaz' arc (where it's dynamically exported in a single file) but it provides the advantage of code splitting. It basically adds @providesModule to all directories in a subdirectory (components/containers) in my case.

I wish there was @providesModule support in CRA :)

[gaearon]

Going to close this as overlapping too much with #1333.