tldr:

Check the repo - common.js includes all dependencies, even though, only one is used on the respective page.

• http://localhost:3000/components/ComponentOne
• http://localhost:3000/components/ComponentTwo

Livedemo: click here

More Details:

I have an app (find attached a grossly simplified version) where based on a user input a different component is rendered. Finding the component to be rendered happens via a component-map. It makes sense that the common.js includes all dependencies for the switcher page, where both components have to be accessible (and thus their dependencies). But it does not make sense for the individual pages to include the respectively other dependency.

To summarize:

• I want to be able to have a large group of components, that can are rendered based on a user's input. It is not feasible for my use-case to serialize and deserialize (as shown here) them as the components are wildly different and require different dependencies
• I also want to render every component out to its own statically generated page, where I retrieve additional SEO information from a database. In this case, however, I only want to load the required dependencies for the particular component at hand.

http://localhost:3000

Selecting ComponentOne results in:

Uses recharts.js

Selecting ComponentTwo results in:

Uses victory.js