code splitting/dynamic import

index.js

// generates a single file for your component.js
// only when used.
// This returns a promise, which needs to be resolved.
import('./components/component.js')

// creates a chunk for each file inside your components folder
// This is called require context (which require.context is used under the hood)
// Webpack is smart enough to do that for you!
const myComponents = (componentName) => import(`./components/${componentName}.js`)