ModuleParseError when referencing external repo

[lancejpollard]

Getting this when I try to reference a separate project (repo/b/components/layout.js):

ModuleParseError: Module parse failed: /path/to/repo/a/node_modules/react-hot-loader/webpack.js!/path/to/repo/b/components/layout.js Unexpected token (65:17)
You may need an appropriate loader to handle this file type.
|     return <div></div>
...

The paths are like:

/repo/a
/repo/a/pages/page1.js
/repo/b
/repo/b/components/layout.js

And in page1.js it is doing this:

import Layout from '../../b/components/layout'

The next server is running from within repo a:

cd repo/a
npm run dev # which is this:
babel-node --presets=es2015,stage-0 --plugins=transform-react-jsx,styled-jsx/babel server.js

• I have searched the issues of this repository and related are Sharing code between multiple websites #1706 and Support code sharing with Next #3018.

Expected Behavior

Expected behavior is that I can load this JSX module from a separate repo outside of the main project.

Current Behavior

Current behavior is that I can't abstract out code into a separate repo if it has JSX in it.

Context

I can't refactor code into a shared lib.

Your Environment

Tech	Version
next	4beta2
node	8.4

[lancejpollard]

@arunoda I also get this error if I npm link repo b into repo a:

cd repo/b
npm link
cd ../..
cd repo/a
npm link repo-b

Then import this instead:

import Layout from 'repo-b/components/layout'

Same error:

ModuleParseError: Module parse failed: /path/to/repo/a/node_modules/react-hot-loader/webpack.js!/path/to/repo/b/components/layout.js Unexpected token (65:17)
You may need an appropriate loader to handle this file type.
|     return <div></div>
...

However there is one small difference. It renders one time without the error, then on refresh is when it shows the error. Not sure. Either way its not working.

[timneutkens]

Duplicate of #706