Skip to content

Module not found: Can't resolve 'd3-drag' in Next.js #556

Open
@karpinski1994

Description

@karpinski1994

Describe the bug
After installing the dependency and running in Next.js 13+ i received the following error:
Failed to compile
./node_modules/react-d3-graph/lib/components/graph/Graph.js:10:0
Module not found: Can't resolve 'd3-drag'

Import trace for requested module:
./node_modules/react-d3-graph/lib/index.js
./pages/graph-visualization.tsx

https://nextjs.org/docs/messages/module-not-found

To Reproduce
Steps to reproduce the behavior:

  1. Install react-d3-graph
  2. Implement any of graph examples from documentation
  3. run yarn dev / npm run dev
  4. See error

Expected behavior
Package working flawlessly

Screenshots
image

Environment:

  • MacOS Ventura 13.2.1 Apple M2
  • Chrome 111.0.5563.64 (Official Build) (arm64)
  • Node version 16.17.0
  • react-d3-graph version 2.6.0

After installing d3-drag as a peerDependency inside the package.json of the package (node_modules/react-d3-graph/package.json) the problem was solved
image

"peerDependencies": {
"d3": "^5.5.0",
"d3-drag": "^3.0.0",
"react": "^16.4.1"
},

I created a dummy quick fix, but not sure whether it is a good approach?
https://github.com/karpinski1994/react-d3-graph/pull/1

Edit:
After just reinstalling d3 to version 7.8.2 I'm having the following error:
image

Adding d3-drag to peerDependencies of the package also solves it upfront

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions