title: Is it possible to have `publicPath` configured dynamically in the browser with webpack?
body: <p>I've got a project where I deploy the same webpack JS bundle to multiple different environments.  Some environments use a CDN to serve static assets like JS files, and some do not and just have static assets served from the same root as the rest of the project.</p>
  
  <p>This project also has multiple async webpack chunks, and so I define a <code>publicPath</code> for them to be correctly loaded.</p>
  
  <p>When deploying to non-cdn, webpack works fine with a statically configured <code>publicPath</code> in my webpack config serving everything from something like <code>/static/</code>.</p>
  
  <p>However when deploying to environments that use a CDN, this no longer works for async chunks, because webpack will try to access these from <code>/static/</code> which means they ask the main app server and not the CDN.</p>
  
  <p>Clearly I can re-build the project with my CDN in <code>publicPath</code> to solve this issue.  However, I'd prefer to be able to use just one deployment package in both situations.  </p>
  
  <p>My server-side app provides a javascript global detailing the CDN root path, along the lines of <code>window.staticCDNRoot</code>.  And this global is also present in non-cdn situations, just pointing back to the app server - so it always resolves to the correct location to load static assets from.  </p>
  
  <p>Is there any way I can get webpack to utilize this at runtime so that <code>publicPath</code> becomes <code>window.staticCDNRoot + publicPath</code> without huge hackery?</p>
  
  <p>Or is there a better solution to this issue?</p>