vercel / vercel/next.js

Module not found: Can't resolve 'react' when importing local library with React as peerDependency

Open
#20,266 14 comments 17 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
JavaScript
Stars
142k
Forks
32.4k
Avg merge
2d 14h
Merged PRs (30d)
351

Description

Bug report

Describe the bug

So I often develop libraries locally with React as a peer dependency. This, however, apparently doesn't work with next.js out of the box or I guess I am supposed to do some additional plumbing to get it to work?

I assume because this works with normal React apps that this isn't a standard behavior or it should at least be well-documented. It is not nice to spend hours fixing these types of bugs. Part of the reason could be my rollup configuration for the local-module yet it baffles what I should do to fix it.

There has been some similar previous discussion #1244 #3841 yet none seem to provide a satisfying answer what is happening.

To Reproduce

https://github.com/TeemuKoivisto/nextjs-react-not-found

Expected behavior

I expect next.js to find the local-module as it can apparently do it quite well if the library is inside the nextjs-app folder.

Screenshots

React not found

System information

  • OS: [macOS catalina]
  • Version of Next.js: [10.0.3]
  • Version of Node.js: [v10.16.0]
  • Deployment: [local]

Additional context

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked reproduction repository and compare its local library setup with the case where the library is inside the Next.js app. Review the related discussions in issues #1244 and #3841; done means the reported peer-dependency case is resolved or the required setup is documented.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, next.js, node.js, react, rollup
Domain
build-system, frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.