Next.js: Build Fails: alias to react-dom/server not found.

[philcockfield]

The next build command fails with the error:

Can't resolve 'react-dom/server'

This occurs when a reference to the slate.js NPM module is added.

• Next.js Version 2.4.4
• Example repo recreating the issue: https://github.com/philcockfield/next-slate-issue

Further details in the README of the example repo.

This seems to be another version of the issue detailed here: https://github.com/zeit/next.js/issues/1877

The fix in that issue, when applied to this repo, does not fix the problem:

// next.config.js

module.exports = {
  webpack: function (c) {
    if (c.resolve.alias) {
      delete c.resolve.alias['react']
      delete c.resolve.alias['react-dom']
    }
    return c
  }
}

[philcockfield]

cc @arunoda

[philcockfield]

Reverting the version of Next to 2.1.1 does allow the project to build.

[arunoda]

I can see what's going on here. Let's see what we can do about this.

[philcockfield]

Thanks @arunoda

[arunoda]

Hey, I couldn't try your project due to there's no tsc command. May be you can update your repo.
I created a normal .js file with this content and it works pretty well:

import React from 'react'
import { Editor, Raw } from 'slate'

const initialState = Raw.deserialize({
  nodes: [
    {
      kind: 'block',
      type: 'paragraph',
      nodes: [
        {
          kind: 'text',
          text: 'A line of text in a paragraph.',
        },
      ],
    },
  ],
}, { terse: true });

export default class Index extends React.Component {
  state = {}

  render () {
    return (
      <div>
        <Editor
          state={initialState}
        />
      </div>
    )
  }
}

---

The reason why next.config.js hack doesn't work is simple. Since your app root is lib the config file needs to be there. I assume, putting that inside src directory works.

[arunoda]

Re-open this issue when you updated the repo. I'd like to do a core fix for this specific issue.

[philcockfield]

Fixed @arunoda. Changed package.json to reference tsc within node_modules.
https://github.com/philcockfield/next-slate-issue/commit/066fb8ac3eabd1b5ec70d8a97ed787893ba004d8

Thanks.

[arunoda]

Creating a file called next.config.ts inside the src directory with the following content will fix the issue as a hotfix:

module.exports = {
  webpack: function (c: any) {
    if (c.resolve.alias) {
      delete c.resolve.alias['react']
      delete c.resolve.alias['react-dom']
    }
    return c
  }
}

[arunoda]

Unfortunately, this is the only solution we can go for now.
This all seems like, we need to revert https://github.com/zeit/next.js/pull/1855

[philcockfield]

Thanks @arunoda

[arunoda]

We've revert #1855 with https://github.com/zeit/next.js/pull/2422 and hope we don't need this anymore.

[rohmanhm]

I'm using next@beta Looks like this is a similar issue.

❯ next build ./dist
The module 'react' was not found. Next.js requires that you include it in 'dependencies' of your 'package.json'. To add it, run 'npm install --save react'
The module 'react-dom' was not found. Next.js requires that you include it in 'dependencies' of your 'package.json'. To add it, run 'npm install --save react-dom'
Using external babel configuration
location: "pathproject/dist/.babelrc"
Using "webpack" config function defined in next.config.js.
^C

I'm using TypeScript too.

Adding

delete config.resolve.alias['react'];
delete config.resolve.alias['react-dom'];

Doesn't work, at all.

It just happen if I build my app, but when I start normally using node ./dist/server.js everything is ok.

[adrian-marcelo-gallardo]

Having the same issue trying to migrate to next5.. @arunoda hotfix solves the issue.. There is any drawback or thing I should be aware after doing that?

[timneutkens]

@adrian-gallardo-wizeline with next 5.1 (soon) you can remove the hotfix 👍
Or use next@canary for now.