React: dynamic import jsx

Question

This question related to dynamically importing JSX files into React.

Basically we have one main component that dynamically renders other components based on a structure

Answer 1

What about having a components/index.js with contents:

export CompA from "./comp_a";
export CompB from "./comp_b";

Then you do:

import * as Components from "./components"

then you would use as:

...

Hope this helps.

I doubt you can load anything when sending path through component props, loading of the file should then happen inside the React component lifecycle methods which is not something I would recommend.