<p dir="auto">Can I pass some variable from create <code class="notranslate">next</code>? for example</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="const app = next({ dev: isDev, customProps: { GA_ID: 'UA_XXXXXX' });"><pre class="notranslate"><code class="notranslate">const app = next({ dev: isDev, customProps: { GA_ID: 'UA_XXXXXX' });
</code></pre></div>
<p dir="auto">then I can get this <code class="notranslate">GA_ID</code> variable in _document.js and render it.</p>
<p dir="auto">I know universal-config provide another way to handle it, but it will be replaced in the build time. If I have several different environment. I have to build by different config. So I hope I can pass variable to render _document.js</p>

<p dir="auto">related issue is <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="186126851" data-permission-text="Title is private" data-url="https://github.com/vercel/next.js/issues/159" data-hovercard-type="issue" data-hovercard-url="/vercel/next.js/issues/159/hovercard" href="https://github.com/vercel/next.js/issues/159">#159</a> but as I mentioned above, universal-config will replace variable in the build time instead of run time. so I hope there is a better way to do that.</p>

<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have searched the <a href="https://github.com/zeit/next.js/issues">issues</a> of this repository and believe that this is not a duplicate.</li>
</ul>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I believe that this is not a duplicate.</li>
</ul>
<h2 dir="auto">Expected Behavior</h2>
<p dir="auto">The text-size-adjust property is part of many css reset (including normalize, check out the first selector <a href="https://necolas.github.io/normalize.css/7.0.0/normalize.css" rel="nofollow">https://necolas.github.io/normalize.css/7.0.0/normalize.css</a>). its goal is to prevent browsers from inflating or deflating text in weird ways when the site is viewed on mobile.</p>
<p dir="auto">This is how it should behave: <a href="https://media.giphy.com/media/3oKIPz6jOMmO3tQkqk/giphy.gif" rel="nofollow">https://media.giphy.com/media/3oKIPz6jOMmO3tQkqk/giphy.gif</a></p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">And this is how it behaves when used with next.js <a href="https://media.giphy.com/media/l4FGBK6OrUm10Xd5e/giphy.gif" rel="nofollow">https://media.giphy.com/media/l4FGBK6OrUm10Xd5e/giphy.gif</a></p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>
<ul dir="auto">
<li>Setup a new next.js project</li>
<li>add normalize (just paste it in a style tag)</li>
<li>add some text (full page length for best results)</li>
<li>use chrome dev tools responsive tool.</li>
</ul>
<h2 dir="auto">Your Environment</h2>
<ul dir="auto">
<li>next 3.0.1-beta.9</li>
<li>node 8.1.3</li>
<li>ubuntu 64</li>
<li>chrome 60.0</li>
</ul>