<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>
<h2 dir="auto">Expected Behavior</h2>


<p dir="auto">This should work:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// in pages/index.js
import { Layout } from 'layout'
export default () =&gt; &lt;Layout /&gt;

// in layout/index.js
export { default as Layout } from './Layout'"><pre class="notranslate"><span class="pl-c">// in pages/index.js</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-v">Layout</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'layout'</span>
<span class="pl-k">export</span> <span class="pl-k">default</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-c1">&lt;</span><span class="pl-ent">Layout</span> <span class="pl-c1">/</span><span class="pl-c1">&gt;</span>

<span class="pl-c">// in layout/index.js</span>
<span class="pl-k">export</span> <span class="pl-kos">{</span> <span class="pl-s1">default</span> <span class="pl-k">as</span> <span class="pl-v">Layout</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'./Layout'</span></pre></div>
<h2 dir="auto">Current Behavior</h2>


<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="export { default as Layout } from './Layout'
^^^^^^

SyntaxError: Unexpected token export"><pre class="notranslate"><code class="notranslate">export { default as Layout } from './Layout'
^^^^^^

SyntaxError: Unexpected token export
</code></pre></div>
<h2 dir="auto">Steps to Reproduce</h2>


<ol dir="auto">
<li>Create a new next app.</li>
<li>Add a custom server.js.</li>
<li>Create a component outside of the pages directory.</li>
<li>Import that component from within pages/index.js.</li>
<li><code class="notranslate">yarn dev</code></li>
</ol>
<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>3.0.6</td>
</tr>
<tr>
<td>node</td>
<td>8.2.1</td>
</tr>
<tr>
<td>OS</td>
<td>macOS Sierra 10.12.4</td>
</tr>
</tbody>
</table>
<p dir="auto">Hello! I'm just now getting started with next (using version 1.2.3), and I have the following folder structure:</p>
<ul dir="auto">
<li>package.json</li>
<li>pages
<ul dir="auto">
<li>index.js</li>
</ul>
</li>
<li>lib
<ul dir="auto">
<li>components
<ul dir="auto">
<li>Test.js</li>
</ul>
</li>
</ul>
</li>
</ul>
<p dir="auto">I have a symlink: <code class="notranslate">node_modules/lib -&gt; ../lib</code>.<br>
I import my <code class="notranslate">Test</code> component with <code class="notranslate">import Test from 'lib/components/Test'</code>.</p>
<p dir="auto">This works fine, but it seems to not be transpiled: if I <code class="notranslate">import</code> anything from my <code class="notranslate">Test</code> component, I get the following error: <code class="notranslate">SyntaxError: Unexpected token import</code>.</p>
<p dir="auto">Any guidance here? I'd be fine having my <code class="notranslate">/components</code> under <code class="notranslate">/pages</code> but I don't want them to be able to be served up standalone.</p>
<p dir="auto">Thanks!</p>