<p dir="auto">We should probably fix <code class="notranslate">styled-jsx</code>'s Global mode (<code class="notranslate">&lt;style jsx global&gt;</code>) working when placed in <code class="notranslate">_document</code> during Development but not when deployed to Production.</p>
<p dir="auto">Also, by fix I don't necessarily mean it has to work in production. Maybe it shouldn't work for development.</p>
<h1 dir="auto">Bug report</h1>
<h2 dir="auto">Describe the bug</h2>
<p dir="auto">I'm working on next.js 7.0.0 and <a class="issue-link js-issue-link notranslate" rel="noopener noreferrer nofollow" href="https://linear.app/vercel/issue/NEXT-css">next-css</a> 1.0.0.<br>
I created following two pages.</p>
<p dir="auto"><em><strong>pages/index.tsx</strong></em></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="import Link from 'next/link';
export default () =&gt; &lt;Link href=&quot;/css&quot;&gt;&lt;a&gt;Go&lt;/a&gt;&lt;/Link&gt;;"><pre class="notranslate"><code class="notranslate">import Link from 'next/link';
export default () =&gt; &lt;Link href="/css"&gt;&lt;a&gt;Go&lt;/a&gt;&lt;/Link&gt;;
</code></pre></div>
<p dir="auto"><em><strong>pages/css.tsx</strong></em></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="import &quot;../style.css&quot;;
export default () =&gt; &lt;div className=&quot;example&quot;&gt;styled text&lt;/div&gt;;"><pre class="notranslate"><code class="notranslate">import "../style.css";
export default () =&gt; &lt;div className="example"&gt;styled text&lt;/div&gt;;
</code></pre></div>
<p dir="auto">When I click the link in the index page, css page is not displayed.<br>
I removed the import statement from css page, it works fine.</p>
<h2 dir="auto">To Reproduce</h2>
<ol dir="auto">
<li>Clone <code class="notranslate">git@github.com:hikoma/next-css-bug.git</code></li>
<li><code class="notranslate">yarn &amp;&amp; yarn dev</code></li>
<li>Click a "With css import" link</li>
</ol>
<h2 dir="auto">Expected behavior</h2>
<p dir="auto">Pages importing css should be loaded.</p>
<h2 dir="auto">System information</h2>
<ul dir="auto">
<li>OS: Ubuntu 18.04</li>
<li>Version of Next.js: 7.0.0</li>
<li>Version of <a class="issue-link js-issue-link notranslate" rel="noopener noreferrer nofollow" href="https://linear.app/vercel/issue/NEXT-css">next-css</a>: 1.0.0</li>
</ul>