<ul dir="auto">
<li>[x ] 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">run without any error</p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">work good with <code class="notranslate">node server.js</code><br>
but with: <code class="notranslate">next export</code> got error  <code class="notranslate">Couldn't find a </code>pages<code class="notranslate"> directory. Please create one under the project root</code></p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>


<ol dir="auto">
<li>move pages to <code class="notranslate">./src</code></li>
<li>create <code class="notranslate">server.js</code></li>
<li>add the code: <code class="notranslate">const app = next({ dev, dir: './src' });</code></li>
<li>run: <code class="notranslate">"export": "next export"</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>4.2.1</td>
</tr>
<tr>
<td>node</td>
<td>v7.6.0</td>
</tr>
<tr>
<td>OS</td>
<td>window 8.1</td>
</tr>
<tr>
<td>browser</td>
<td>chrome</td>
</tr>
</tbody>
</table>
<p dir="auto">In repositories with multiple projects, sometimes it is appealing to share code between the projects. Next currently requires that all of the site code is under the Next project's root directory. With code sharing, the shared code usually resides outside of the Next project's root. With a few modifications to the Webpack config and Babel plugins, Next can support code outside of its project root.</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">In a directory hierarchy that looks like this:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content=".
├── next
│   └── pages
└── shared
    └── module.js"><pre class="notranslate"><code class="notranslate">.
├── next
│   └── pages
└── shared
    └── module.js
</code></pre></div>
<p dir="auto">A file under <code class="notranslate">next/pages</code> should be able to do <code class="notranslate">import module from '../../shared/module'</code> or use a Babel plugin like <a href="https://github.com/tleunen/babel-plugin-module-resolver">module-resolver</a> to require code that is outside of the Next project root.</p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">Next does not run the shared code through the same Webpack loaders as the ones used for code under the Next project's root. Also, the shared code is not compiled and emitted under <code class="notranslate">.next/dist</code>, and require/import paths to that shared code are not correct.</p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>
<ol dir="auto">
<li>Set up a directory structure like the on in the ASCII art diagram above</li>
<li>Add <code class="notranslate">index.js</code> under <code class="notranslate">next/pages</code> with <code class="notranslate">import module from '../../shared</code></li>
<li>Run <code class="notranslate">yarn dev</code> and get errors</li>
</ol>
<h2 dir="auto">Context</h2>
<p dir="auto">In general this is useful for any project that has a website (vs. being only a website) and wants to share code between the Next website and other programs. Specifically I am writing this up since we need it for sharing code across expo.io, snack.expo.io (not yet Next.js), Node servers, and native apps.</p>
<p dir="auto">This is a list of PRs so far to support code sharing:</p>
<ul dir="auto">
<li>Apply .babelrc's own config when it specifies <code class="notranslate">babelrc: false</code>: <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="261747092" data-permission-text="Title is private" data-url="https://github.com/vercel/next.js/issues/3016" data-hovercard-type="pull_request" data-hovercard-url="/vercel/next.js/pull/3016/hovercard" href="https://github.com/vercel/next.js/pull/3016">#3016</a></li>
</ul>
<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.0.0-beta.2</td>
</tr>
<tr>
<td>node</td>
<td>8.6.0</td>
</tr>
<tr>
<td>OS</td>
<td>macOS 10.13</td>
</tr>
<tr>
<td>browser</td>
<td>*</td>
</tr>
</tbody>
</table>