<p dir="auto">I'm trying to use Next.js to render part of my app, but I keep getting</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="ReferenceError: document is not defined
    at Object.&lt;anonymous&gt; (/Users/patricklu/Q5/lunyr/Lunyr-Frontend/node_modules/domkit/builtinStyle.js:3:18)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object.&lt;anonymous&gt; (/Users/patricklu/Q5/lunyr/Lunyr-Frontend/node_modules/domkit/getVendorPropertyName.js:3:20)
    at Module._compile (module.js:569:30)"><pre class="notranslate"><code class="notranslate">ReferenceError: document is not defined
    at Object.&lt;anonymous&gt; (/Users/patricklu/Q5/lunyr/Lunyr-Frontend/node_modules/domkit/builtinStyle.js:3:18)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object.&lt;anonymous&gt; (/Users/patricklu/Q5/lunyr/Lunyr-Frontend/node_modules/domkit/getVendorPropertyName.js:3:20)
    at Module._compile (module.js:569:30)
</code></pre></div>
<p dir="auto">There's no instance in my app where I reference domkit, but somehow it keeps showing up. I only have one page in my app, and I've gone so far as to change my render method to this:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="render() {
    return (
      &lt;div&gt;
      &lt;/div&gt;
    );
  }
}"><pre class="notranslate"><code class="notranslate">render() {
    return (
      &lt;div&gt;
      &lt;/div&gt;
    );
  }
}
</code></pre></div>
<p dir="auto">But it's still not rendering properly.</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?q=is%3Aissue">issues</a> of this repository and believe that this is not a duplicate.</li>
</ul>
<h2 dir="auto">Expected Behavior</h2>


<p dir="auto">Renders fine.</p>
<h2 dir="auto">Current Behavior</h2>


<p dir="auto">Render error</p>
<h2 dir="auto">Your Environment</h2>

<table role="table">
<thead>
<tr>
<th>Tech</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>next</td>
<td>5</td>
</tr>
<tr>
<td>node</td>
<td>8.1.2</td>
</tr>
<tr>
<td>OS</td>
<td>macOs</td>
</tr>
<tr>
<td>browser</td>
<td>Chrome</td>
</tr>
<tr>
<td>etc</td>
<td></td>
</tr>
</tbody>
</table>
<p dir="auto">Hi there, I'm trying to find a way to know if i'm coming through browser history.<br>
The page gets its initial data through custom routing, eventually fetching it on its own if the<br>
variable is empty.</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="
class Index extends Component {
  static async getInitialProps ({ query, store }) {
    const loc = store.getState().localization
        
    let pageData = query.initialData
    
    if (!pageData) {
      const Fetch = new ApiGetHome(`${loc.region}/${loc.language}`)
      const res = await Fetch.getData()
      pageData = res.response[0]
    }

    // destructuring response data
    const { title, slider, main, footer } = pageData

    [...]"><pre class="notranslate"><span class="pl-k">class</span> <span class="pl-v">Index</span> <span class="pl-k">extends</span> <span class="pl-v">Component</span> <span class="pl-kos">{</span>
  <span class="pl-k">static</span> <span class="pl-k">async</span> <span class="pl-c1">getInitialProps</span> <span class="pl-kos">(</span><span class="pl-kos">{</span> query<span class="pl-kos">,</span> store <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-k">const</span> <span class="pl-s1">loc</span> <span class="pl-c1">=</span> <span class="pl-s1">store</span><span class="pl-kos">.</span><span class="pl-en">getState</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">localization</span>
        
    <span class="pl-k">let</span> <span class="pl-s1">pageData</span> <span class="pl-c1">=</span> <span class="pl-s1">query</span><span class="pl-kos">.</span><span class="pl-c1">initialData</span>
    
    <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-c1">!</span><span class="pl-s1">pageData</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
      <span class="pl-k">const</span> <span class="pl-v">Fetch</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> <span class="pl-v">ApiGetHome</span><span class="pl-kos">(</span><span class="pl-s">`<span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">loc</span><span class="pl-kos">.</span><span class="pl-c1">region</span><span class="pl-kos">}</span></span>/<span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">loc</span><span class="pl-kos">.</span><span class="pl-c1">language</span><span class="pl-kos">}</span></span>`</span><span class="pl-kos">)</span>
      <span class="pl-k">const</span> <span class="pl-s1">res</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-v">Fetch</span><span class="pl-kos">.</span><span class="pl-en">getData</span><span class="pl-kos">(</span><span class="pl-kos">)</span>
      <span class="pl-s1">pageData</span> <span class="pl-c1">=</span> <span class="pl-s1">res</span><span class="pl-kos">.</span><span class="pl-c1">response</span><span class="pl-kos">[</span><span class="pl-c1">0</span><span class="pl-kos">]</span>
    <span class="pl-kos">}</span>

    <span class="pl-c">// destructuring response data</span>
    <span class="pl-k">const</span> <span class="pl-kos">{</span> title<span class="pl-kos">,</span> slider<span class="pl-kos">,</span> main<span class="pl-kos">,</span> footer <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-s1">pageData</span>

    <span class="pl-kos">[</span>...<span class="pl-kos">]</span></pre></div>
<p dir="auto">Navigating to an Internal URL, and then coming back from browser history, I think that getting a variable like <code class="notranslate">isFromHistory</code> or something similiar could be useful to prevent a new data fetch.</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>