search

sanity-io / hierarchical-document-list

Plugin for editing hierarchical references in the Sanity studio.
MIT License
41 stars 8 forks source link

@nosferatu500/react-sortable-tree is not compatible with react-dnd@16 #16

Open tveryakoff opened 11 months ago

tveryakoff commented 11 months ago

Describe the bug

Crashes due to unresolved DragSource import:

 [ERROR] No matching export in "../../node_modules/.pnpm/react-dnd@16.0.1_@types+node@20.10.4_react@18.2.0/node_modules/react-dnd/dist/index.js" for import "DragSource"

    ../../node_modules/.pnpm/@nosferatu500+react-sortable-tree@4.4.0_react-dnd@16.0.1_react-dom@18.2.0_react@18.2.0/node_modules/@nosferatu500/react-sortable-tree/esm/index.js:5:9:
      5 │ import { DragSource, DropTarget, DndContext, DndProvider } from 'react-dnd';

To Reproduce

dependencies:

"dependencies": {
    "@sanity/client": "^5.4.2",
    "@sanity/code-input": "^4.1.1",
    "@sanity/color-input": "^3.1.0",
    "@sanity/scheduled-publishing": "^1.2.2",
    "@sanity/vision": "3.17.0",
    "cloudinary": "^1.33.0",
    "lodash": "^4.17.21",
    "prop-types": "^15.8.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "sanity": "3.17.0",
    "sanity-plugin-cloudinary": "1.1.1",
    "sanity-plugin-markdown": "4.1.0",
    "styled-components": "^5.3.11",
  },
  "devDependencies": {
    "@sanity/cli": "^3.16.4",
    "@sanity/eslint-config-studio": "^3.0.1",
    "@sanity/types": "^3.16.4",
    "@swc/cli": "^0.1.62",
    "@swc/core": "^1.3.62",
    "@vitejs/plugin-react": "^4.1.0",
    "typescript": "^4.8.4"
  }

Description

@sanity/hierarchical-document-list has @nosferatu500/react-sortable-tree and "react-dnd": "16.0.1" in dependencies, however @nosferatu500/react-sortable-tree expects react-dnd@14 in peerDependencies, which causes a crash due to failed imports from react-dnd

peerDependencies": {
    "react": "^17.0.0 || ^18.0.0",
    "react-dnd": "14.0.4",
    "react-dom": "^17.0.0 || ^18.0.0"
  }

Expected behavior Plugin is compatible with react-dnd@16.x or has react-dnd@14 in dependencies

Full error log

✘ [ERROR] No matching export in "../../node_modules/.pnpm/react-dnd@16.0.1_@types+node@20.10.4_react@18.2.0/node_modules/react-dnd/dist/index.js" for import "DragSource"

    ../../node_modules/.pnpm/@nosferatu500+react-sortable-tree@4.4.0_react-dnd@16.0.1_react-dom@18.2.0_react@18.2.0/node_modules/@nosferatu500/react-sortable-tree/esm/index.js:5:9:
      5 │ import { DragSource, DropTarget, DndContext, DndProvider } from 'react-dnd';
        ╵          ~~~~~~~~~~

✘ [ERROR] No matching export in "../../node_modules/.pnpm/react-dnd@16.0.1_@types+node@20.10.4_react@18.2.0/node_modules/react-dnd/dist/index.js" for import "DropTarget"

    ../../node_modules/.pnpm/@nosferatu500+react-sortable-tree@4.4.0_react-dnd@16.0.1_react-dom@18.2.0_react@18.2.0/node_modules/@nosferatu500/react-sortable-tree/esm/index.js:5:21:
      5 │ import { DragSource, DropTarget, DndContext, DndProvider } from 'react-dnd';
        ╵                      ~~~~~~~~~~

7:19:51 PM [vite] error while updating dependencies:
Error: Build failed with 2 errors:
../../node_modules/.pnpm/@nosferatu500+react-sortable-tree@4.4.0_react-dnd@16.0.1_react-dom@18.2.0_react@18.2.0/node_modules/@nosferatu500/react-sortable-tree/esm/index.js:5:9: ERROR: No matching export in "../../node_modules/.pnpm/react-dnd@16.0.1_@types+node@20.10.4_react@18.2.0/node_modules/react-dnd/dist/index.js" for import "DragSource"
../../node_modules/.pnpm/@nosferatu500+react-sortable-tree@4.4.0_react-dnd@16.0.1_react-dom@18.2.0_react@18.2.0/node_modules/@nosferatu500/react-sortable-tree/esm/index.js:5:21: ERROR: No matching export in "../../node_modules/.pnpm/react-dnd@16.0.1_@types+node@20.10.4_react@18.2.0/node_modules/react-dnd/dist/index.js" for import "DropTarget"
lasseaeggen commented 11 months ago

If it's OK with your setup and guidelines, you can add shamefully-hoist=true to your Sanity Studio's .npmrc in order to resolve the packages until a fix is provided. https://pnpm.io/npmrc#shamefully-hoist

You can be more specific than "shamefully" with the other settings mentioned here: https://pnpm.io/npmrc#dependency-hoisting-settings.

donalffons commented 10 months ago

I'm experiencing the same issue. Unfortunately, the proposed fix doesn't seem to do anything in my case.

donalffons commented 9 months ago

Here is what did the trick for me (using pnpm as the package manager and an embedded sanity studio)

In my package.json (in my case, it's a monorepo, so it is at the root level package.json), I added

  "pnpm": {
    "overrides": {
      "react-dnd": "^14.0.5",
      "react-dnd-html5-backend": "^14.1.0"
    }
  }

This enforces the specified version across all dependencies and sub-dependencies. No need to change settings in the .npmrc.

To me it looks like a better fix would be to fix the version numbers in the package.json of this package. This package seems to be incompatible with versions >14 of react-dnd.