title: Environment Variables in an isomorphic JS app: Webpack find & replace?
body: <p>I'm using webpack to bundle an isomorphic JS app (<a href="https://github.com/DavidWells/isomorphic-react-example" rel="noreferrer">based on this example</a>) so that the browser runs the same code as the server. Everything is running smoothly except I have a <code>config.js</code> with some settings which are pulled in from environment variables on the server:</p>
  
  <pre><code>module.exports = {
    servers:
      auth: process.env.AUTH_SERVER_URL,
      content: process.env.CONTENT_SERVER_URL
    }
  }
  </code></pre>
  
  <p>On the server this is grand, but when webpack renders this for the client <code>process</code> is empty and this doesn't work.</p>
  
  <p>I'm hoping there's a kind of 'find and replace' webpack plugin that will replace them with their content in that file alone?</p>
  
  <pre><code>"…config.js content…".replace(/process\.env\.([a-z0-9_]+)/, function(match, varName) {
    return process.env[varName];
  })
  </code></pre>