title: How to add hash to bundle name in SSR react app
body: <p>I have ssr app and server has code (simplified)</p>
  
  <pre class="lang-js prettyprint-override"><code> const content = renderToString(
      &lt;Provider store={store}&gt;
        &lt;StaticRouter location={req.path} context={context}&gt;
          &lt;div&gt;{renderRoutes(Routes)}&lt;/div&gt;
        &lt;/StaticRouter&gt;
      &lt;/Provider&gt;
    );
  
   return `
      &lt;html&gt;
        &lt;head&gt;
        &lt;/head&gt;
        &lt;body&gt;
          &lt;div id="root"&gt;${content}&lt;/div&gt;
          &lt;script src="/bundle.js"&gt;&lt;/script&gt;
        &lt;/body&gt;
      &lt;/html&gt;
    `;
  </code></pre>
  
  <p>The problems is, that a want to add hash to bundle.js which is composed by webpack. I can edit webpack config which compiles bundle so it will hash in the name, but server code has no idea about dynamic name of bundle.</p>
  
  <p>I have two solutions:</p>
  
  <ol>
  <li>Add plugin to webpack so it will make template (for example <code>.hbs</code>) file with bundle name already inserted in it and then modify it on server to insert additional data (like meta, content and so on). I don't like this solution because it will require reading file on every request</li>
  <li>Set dynamical ENV variable in webpack config which compiles client, add it to bundle name and then access in ENV on server </li>
  </ol>
  
  <pre class="lang-js prettyprint-override"><code>const crypto = require('crypto');
  process.env.BUILD_HASH = crypto.randomBytes(20).toString('hex');
  const BUILD_HASH = process.env.BUILD_HASH
  console.log('building client')
  
  const config = {
    output: {
      filename: `bundle_${BUILD_HASH}.js`,
      path: path.resolve(__dirname, 'public')
    }
  };
  </code></pre>
  
  <p>I don't like this solution because it requires to set ENV var dynamically</p>