Skip to content

@clerk/clerk-react should have react-dom as a peer dep #2107

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
4 tasks done
hzuo opened this issue Nov 10, 2023 · 4 comments
Closed
4 tasks done

@clerk/clerk-react should have react-dom as a peer dep #2107

hzuo opened this issue Nov 10, 2023 · 4 comments
Labels
bug Something isn't working good first issue Good for newcomers react

Comments

@hzuo
Copy link

hzuo commented Nov 10, 2023

Preliminary Checks

Reproduction / Replay Link

n/a

Publishable key

n/a

Description

Steps to reproduce:

Building an app that depends on @clerk/clerk-react with vite results in the following error:

[vite]: Rollup failed to resolve import "react-dom" from "<redacted>/web/node_modules/.pnpm/@[email protected][email protected]/node_modules/@clerk/clerk-react/dist/esm/utils/useCustomElementPortal.js". This is most likely unintended because it can break your application at runtime.

Expected behavior:

vite build should work.

Actual behavior:

see the above

Environment

N/A

Problem

useCustomElementPortal.tsx has import { createPortal } from 'react-dom'; but react-dom is not listed as a peer dep or a dep in @clerk/clerk-react's package.json.

@hzuo hzuo added the needs-triage A ticket that needs to be triaged by a team member label Nov 10, 2023
@hzuo
Copy link
Author

hzuo commented Nov 10, 2023

Indeed if I force it as a peer dep using pnpm's packageExtension mechanism vite build now works:

  "pnpm": {
    "packageExtensions": {
      "@clerk/clerk-react": {
        "peerDependencies": {
          "react-dom": "*"
        }
      }
    }
  }

@LekoArts LekoArts added bug Something isn't working good first issue Good for newcomers react and removed needs-triage A ticket that needs to be triaged by a team member labels Nov 13, 2023
@LekoArts
Copy link
Member

Hey, thanks for the issue!

That is indeed correct, it should set react-dom as a peerDep.
To anyone who wants to pick this up, go to here:

"peerDependencies": {
"react": ">=16"
},

And add:

"react-dom": ">=16"

github-merge-queue bot pushed a commit that referenced this issue Nov 20, 2023
* chore(repo): Upgrade minimum version of react to >=18

* chore(repo): Add react-dom@>=18 peer dependency to resolve issue

GH issue: #2107

* chore(repo): Add changeset

* chore(localizations): Fix formatting of ru-RU
@LekoArts
Copy link
Member

This was fixed in #2164 and will be released with a new major. You can install npm install @clerk/clerk-react@alpha-v5 to try out the pre-release.

@clerk-cookie
Copy link
Collaborator

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@clerk clerk locked as resolved and limited conversation to collaborators Nov 29, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Something isn't working good first issue Good for newcomers react
Projects
None yet
Development

No branches or pull requests

3 participants