<p dir="auto">Requiring a package in bundle e.g. <code class="notranslate">import camelcase from 'camelcase'</code> resolves to <code class="notranslate">&lt;root_dir&gt;/node_modules/next/node_modules/camelcase</code> before <code class="notranslate">&lt;root_dir&gt;/node_modules</code>.</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>
<h2 dir="auto">Expected Behavior</h2>
<p dir="auto">Requiring a package that's a direct dependency resolves project's <code class="notranslate">node_modules</code></p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">Webpack looks in next's nested node_modules</p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>


<ol dir="auto">
<li><code class="notranslate">yarn add camelcase@3.0.0</code></li>
<li>add import to a <code class="notranslate">pages/index.js</code> <code class="notranslate">import camelcase from 'camelcase'</code></li>
<li><code class="notranslate">next build</code></li>
<li>Build bundles package/chunk using next's <code class="notranslate">camelcase</code> which is version 4
<ol dir="auto">
<li>Which leads to an uglifyJS error because camelcase v4 is published as es2015.</li>
</ol>
</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>4.2</td>
</tr>
<tr>
<td>node</td>
<td>8</td>
</tr>
</tbody>
</table>
<p dir="auto">Note: I know <code class="notranslate">camelcase</code> is not a browser module, but it's just an example.</p>
<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>