should not be used in _document.js's <Head> </h1> </a> <a name="//apple_ref/cpp/Section/››› Why This Error Occurred" class="dashAnchor"> <h4> Why This Error Occurred </h4> </a> <p>Adding <code><title></code> in <code>pages/_document.js</code> will lead to unexpected results with <code>next/head</code> since <code>_document.js</code> is only rendered on the initial pre-render.</p> <a name="//apple_ref/cpp/Section/››› Possible Ways to Fix It" class="dashAnchor"> <h4> Possible Ways to Fix It </h4> </a> <p>Set <code><title></code> in <code>pages/_app.js</code> instead:</p> <pre><code class="language-js"><span class="token comment">// pages/_app.js</span> <span class="token keyword">import</span> React <span class="token keyword">from</span> <span class="token string">'react'</span> <span class="token keyword">import</span> Head <span class="token keyword">from</span> <span class="token string">'next/head'</span> <span class="token keyword">function</span> <span class="token function">MyApp</span><span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> Component<span class="token punctuation">,</span> pageProps <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token punctuation">(</span> <span class="token operator"><</span><span class="token operator">></span> <span class="token operator"><</span>Head<span class="token operator">></span> <span class="token operator"><</span>title<span class="token operator">></span>My <span class="token keyword">new</span> <span class="token class-name">cool</span> app<span class="token operator"><</span><span class="token operator">/</span>title<span class="token operator">></span> <span class="token operator"><</span><span class="token operator">/</span>Head<span class="token operator">></span> <span class="token operator"><</span>Component <span class="token punctuation">{</span><span class="token operator">...</span>pageProps<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">></span> <span class="token operator"><</span><span class="token operator">/</span><span class="token operator">></span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">export</span> <span class="token keyword">default</span> MyApp </code></pre> <a name="//apple_ref/cpp/Section/›› Useful Links" class="dashAnchor"> <h3> Useful Links </h3> </a> <ul> <li><a title="null" href="https://github.com/vercel/next.js/issues/4596.html">The issue this was reported in: #4596</a></li> </ul> </body> </html>