<h1 dir="auto">Bug report</h1>
<h2 dir="auto">Describe the bug</h2>
<p dir="auto">A clear and concise description of what the bug is.</p>
<h2 dir="auto">To Reproduce</h2>
<p dir="auto">Steps to reproduce the behavior, please provide code snippets or a repository:</p>
<ol dir="auto">
<li>
<p dir="auto">Clone <a href="https://github.com/tenjojeremy/test-nextjs-simple.git">https://github.com/tenjojeremy/test-nextjs-simple.git</a></p>
</li>
<li>
<p dir="auto">run <code class="notranslate">yarn</code></p>
</li>
<li>
<p dir="auto">run <code class="notranslate">yarn start</code></p>
</li>
<li>
<p dir="auto">open localhost</p>
</li>
<li>
<p dir="auto">you should see 3 posters<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/25231946/63126077-12477180-bf7d-11e9-8392-44d335cf7964.png"><img src="https://user-images.githubusercontent.com/25231946/63126077-12477180-bf7d-11e9-8392-44d335cf7964.png" alt="posters" style="max-width: 100%;"></a></p>
</li>
<li>
<p dir="auto">run <code class="notranslate">now</code></p>
</li>
<li>
<p dir="auto">open production site</p>
</li>
<li>
<p dir="auto">you will see a 500 error<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/25231946/63126152-3c009880-bf7d-11e9-9dc4-b828fd5c2d93.png"><img src="https://user-images.githubusercontent.com/25231946/63126152-3c009880-bf7d-11e9-9dc4-b828fd5c2d93.png" alt="500" style="max-width: 100%;"></a></p>
</li>
<li>
<p dir="auto">open runtime logs in your dashboard</p>
</li>
<li>
<p dir="auto">see<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/25231946/63125928-cac0e580-bf7c-11e9-8e1b-c9a7d9275d02.png"><img src="https://user-images.githubusercontent.com/25231946/63125928-cac0e580-bf7c-11e9-8e1b-c9a7d9275d02.png" alt="error" style="max-width: 100%;"></a></p>
</li>
</ol>
<h2 dir="auto">Expected behavior</h2>
<p dir="auto">Should display 3 movie posters in production not a 500 error</p>
<h1 dir="auto">Feature request</h1>
<h2 dir="auto">Is your feature request related to a problem? Please describe.</h2>
<p dir="auto">It's currently not possible to read files from API routes or pages.</p>
<h2 dir="auto">Describe the solution you'd like</h2>
<p dir="auto">I want to be able to call <code class="notranslate">fs.readFile</code> with a <code class="notranslate">__dirname</code> path and have it "just work".</p>
<p dir="auto">This should work in Development and Production mode.</p>
<h2 dir="auto">Describe alternatives you've considered</h2>
<p dir="auto">This may need to integrate with <code class="notranslate">@zeit/webpack-asset-relocator-loader</code> in some capacity. This plugin handles these types of requires.</p>
<p dir="auto">However, it's not a necessity. I'd be OK with something that <em>only</em> works with <code class="notranslate">__dirname</code> and <code class="notranslate">__filename</code> (no relative or cwd-based paths).</p>
<h2 dir="auto">Additional context</h2>
<p dir="auto">Example:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// pages/api/test.js
import fs from 'fs'
import path from 'path'

export default (req, res) =&gt; {
  const fileContent = fs.readFileSync(
    path.join(__dirname, '..', '..', 'package.json'), 
    'utf8'
  )
  // ...
}"><pre class="notranslate"><span class="pl-c">// pages/api/test.js</span>
<span class="pl-k">import</span> <span class="pl-s1">fs</span> <span class="pl-k">from</span> <span class="pl-s">'fs'</span>
<span class="pl-k">import</span> <span class="pl-s1">path</span> <span class="pl-k">from</span> <span class="pl-s">'path'</span>

<span class="pl-k">export</span> <span class="pl-k">default</span> <span class="pl-kos">(</span><span class="pl-s1">req</span><span class="pl-kos">,</span> <span class="pl-s1">res</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-k">const</span> <span class="pl-s1">fileContent</span> <span class="pl-c1">=</span> <span class="pl-s1">fs</span><span class="pl-kos">.</span><span class="pl-en">readFileSync</span><span class="pl-kos">(</span>
    <span class="pl-s1">path</span><span class="pl-kos">.</span><span class="pl-en">join</span><span class="pl-kos">(</span><span class="pl-s1">__dirname</span><span class="pl-kos">,</span> <span class="pl-s">'..'</span><span class="pl-kos">,</span> <span class="pl-s">'..'</span><span class="pl-kos">,</span> <span class="pl-s">'package.json'</span><span class="pl-kos">)</span><span class="pl-kos">,</span> 
    <span class="pl-s">'utf8'</span>
  <span class="pl-kos">)</span>
  <span class="pl-c">// ...</span>
<span class="pl-kos">}</span></pre></div>
<blockquote>
<p dir="auto">Note: I know you can cheat the above example <g-emoji class="g-emoji" alias="point_up" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/261d.png">☝️</g-emoji> with <code class="notranslate">require</code>, but that's not the point. <g-emoji class="g-emoji" alias="smile" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f604.png">😄</g-emoji></p>
</blockquote>