title: How to do client-specific imports in a React frontend?
body: <p>I'm working on a new project where I'm taking a full-stack application and decoupling the UI from the backend -- so basically our backend will be just a JSON API a new React-based frontend talks to.</p>
  
  <p>The way our current full-stack architecture works is we have a base application in <code>/core/app</code> and then a client overrides folder for each client <code>/clients/client{1,2,3}/app</code> and then our file include logic checks the client folder first and then the core folder as a fallback.  </p>
  
  <p>Like php <code>include_path</code> precedence logic.</p>
  
  <p>I feel pretty confident in how I'll setup the core app, but I'm not quite sure how I'll handle this override concept.</p>
  
  <p>Ideally when I call:
  <code>import MyComponent from '../components/MyComponent</code></p>
  
  <p>I know import statements can't be dynamic, but I'm looking for a solution to check in <code>/clients/client1/components/MyComponent</code> first and then <code>/core/component/components/MyComponent</code> second.</p>
  
  <p>What is the recommended way to handle this sort of usecase?  I thought about trying to be fancy with symlinks (ie: by default, each client gets a symlink to every single item in the core and then they'd override it as needed and replace the symlink).</p>
  
  <p>That seems kind of hacky and I'm not sure how it'd work with hot-reloading so I'm hoping there's a more elegant approach.</p>