react-joyride fails to compile (Next.js, webpack)

EliasVal commented 2 weeks ago

🐛 Bug Report

When trying to compile a Next.js app using react-joyride (React-rc, ReactDOM-rc, Next.js-canary), the build fails.

To Reproduce

Install react-joyride in a Next.js app
Use normally
Try to build

Expected behavior

Normal build

Current behavior

Build fails with the following output:

../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-eb3ad065-20240822_react@19.0.0-rc_qpewlespqf4wu6jearwtdzidwq/node_modules/react-joyride/dist/index.mjs
Attempted import error: 'unmountComponentAtNode' is not exported from 'react-dom' (imported as 'ReactDOM').

Import trace for requested module:
../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-eb3ad065-20240822_react@19.0.0-rc_qpewlespqf4wu6jearwtdzidwq/node_modules/react-joyride/dist/index.mjs
../../packages/ui/JoyrideComponent.tsx
./app/connected/layout.tsx

../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-eb3ad065-20240822_react@19.0.0-rc_qpewlespqf4wu6jearwtdzidwq/node_modules/react-joyride/dist/index.mjs
Attempted import error: 'unstable_renderSubtreeIntoContainer' is not exported from 'react-dom' (imported as 'ReactDOM').

Import trace for requested module:
../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-eb3ad065-20240822_react@19.0.0-rc_qpewlespqf4wu6jearwtdzidwq/node_modules/react-joyride/dist/index.mjs
../../packages/ui/JoyrideComponent.tsx
./app/connected/layout.tsx

../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-1eaccd82-20240816_react@19.0.0-rc_cwhwwon4ia5c6s37jmb66zmj2i/node_modules/react-joyride/dist/index.mjs
Attempted import error: 'unmountComponentAtNode' is not exported from 'react-dom' (imported as 'ReactDOM').

Import trace for requested module:
../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-1eaccd82-20240816_react@19.0.0-rc_cwhwwon4ia5c6s37jmb66zmj2i/node_modules/react-joyride/dist/index.mjs
./app/connected/layout.tsx

../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-1eaccd82-20240816_react@19.0.0-rc_cwhwwon4ia5c6s37jmb66zmj2i/node_modules/react-joyride/dist/index.mjs
Attempted import error: 'unstable_renderSubtreeIntoContainer' is not exported from 'react-dom' (imported as 'ReactDOM').
Import trace for requested module:
../../node_modules/.pnpm/react-joyride@2.8.2_@types+react@18.3.4_react-dom@19.0.0-rc-1eaccd82-20240816_react@19.0.0-rc_cwhwwon4ia5c6s37jmb66zmj2i/node_modules/react-joyride/dist/index.mjs
./app/connected/layout.tsx

System Information

System:
    OS: Windows 11 10.0.22631
    CPU: (24) x64 13th Gen Intel(R) Core(TM) i7-13700
    Memory: 36.57 GB / 63.70 GB
  Binaries:
    Node: 20.16.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.22 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 10.2.1 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.9.0 - ~\AppData\Local\pnpm\pnpm.CMD
    bun: 1.1.0 - ~\.bun\bin\bun.EXE
  npmPackages:
    react-joyride: ^2.8.2 => 2.8.2

EliasVal commented 2 weeks ago

It seems #1062 would resolve this issue

gilbarbara commented 2 weeks ago

Yeah, this library isn't compatible with React 19 yet.

EliasVal commented 2 weeks ago

Any plans/estimations on React 19 compatibility?

islamCodehood commented 1 week ago

Any updates for this?

EliasVal commented 1 week ago

Any updates for this?

It seems like @gilbarbara has other plans before updating this package to support React v19, which I disagree with but hey, I don't maintain nor contribute to this package 😅

But, in my opinion, React v19 should be prioritized since it is nearing release, and versions before 16.3 are being used less and less. One way to keep both parties happy is to do the v19 update and backport any new features @gilbarbara would like the React <16.3 folks to have. But supporting those legacy React versions is pretty pointless.

Anywho, my workaround was to clone and build #1062 and add it as a package in my monorepo. Is it the best way? I don't know. Does it work? sure does!

cjkihl commented 4 days ago

I've published a separate package in the meanwhile. https://www.npmjs.com/package/react-joyride-react-19

npm install react-joyride-react-19 It includes the latest from main and PR https://github.com/gilbarbara/react-joyride/pull/1062

I hope we can find a way moving forward where we can support React 19 and still keep backwards compatibility in the original package.

gilbarbara / react-joyride