Conflicting peer dependency: [email protected] #1369

CrowderSoup · 2023-09-21T06:14:11Z

Please list the package(s) involved in the issue, and include the version you are using

❯ node -v
v18.14.0
❯ npm -v
9.2.0
❯ npm run shopify version

> shopify
> shopify version

Current Shopify CLI version: 3.49.3

Describe the bug

After running npm run shopify app generate extension -- -n "Checkout UI" --template checkout_ui and then npm run dev I get:

✘ [ERROR] Could not resolve "@shopify/ui-extensions-react/checkout"

    extensions/govalo-card-lookup/src/Checkout.tsx:6:7:
      6 │ } from '@shopify/ui-extensions-react/checkout';
        ╵        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "@shopify/ui-extensions-react/checkout" as external to exclude it from the
  bundle, which will remove this error.

Which leads me to believe I need to install the @shopify/ui-extensions-react/checkout dependency. However, when I try to do so I get:

❯ npm i @shopify/ui-extensions-react
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: govalo@undefined
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   peer react@"18.2.0" from @shopify/[email protected]
npm ERR!   node_modules/@shopify/app
npm ERR!     @shopify/app@"^3.49.3" from the root project
npm ERR!   react@"18.2.0" from @shopify/[email protected]
npm ERR!   node_modules/@shopify/cli-kit
npm ERR!     @shopify/cli-kit@"3.49.3" from @shopify/[email protected]
npm ERR!     node_modules/@shopify/app
npm ERR!       @shopify/app@"^3.49.3" from the root project
npm ERR!     @shopify/cli-kit@"3.49.3" from @shopify/[email protected]
npm ERR!     node_modules/@shopify/cli
npm ERR!       @shopify/cli@"^3.49.3" from the root project
npm ERR!     2 more (@shopify/plugin-cloudflare, @shopify/plugin-did-you-mean)
npm ERR!   2 more (ink, react-reconciler)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! @shopify/ui-extensions-react@"*" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/react
npm ERR!   peer react@">=17.0.0 <18.0.0" from @shopify/[email protected]
npm ERR!   node_modules/@shopify/ui-extensions-react
npm ERR!     @shopify/ui-extensions-react@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

Steps to reproduce the behavior:

Have the above listed versions of node, npm, and the shopify app/cli installed
Try to install @shopify/ui-extensions-react with npm i

Expected behavior

Installs the package without error

The text was updated successfully, but these errors were encountered:

SaadMay0 · 2023-09-28T14:33:42Z

facing same issue with that dependency
"@shopify/app": "^3.48.1",
"@shopify/cli": "^3.48.1",
"@shopify/ui-extensions": "2023.7.0",
"@shopify/ui-extensions-react": "2023.7.0",

code ERESOLVE

npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@">=18.0.0" from [email protected]
npm ERR! node_modules/ink
npm ERR! peer ink@"4.2.0" from @shopify/[email protected]
npm ERR! node_modules/@shopify/app
npm ERR! @shopify/app@"^3.45.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

SaadMay0 · 2023-09-28T14:44:02Z

Current Shopify CLI version: 3.48.0
node -v
20.3.0
npm -v
9.7.1

SaadMay0 · 2023-09-28T14:45:36Z

npm i @shopify/ui-extensions-react

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@">=18.0.0" from [email protected]
npm ERR! node_modules/ink
npm ERR! peer ink@"4.2.0" from @shopify/[email protected]
npm ERR! node_modules/@shopify/app
npm ERR! @shopify/app@"^3.48.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

dani-sanomads · 2023-09-30T09:00:38Z

You can use this to fix it at the moment because one of them was on 3.49.3 for me.
"@shopify/app": "3.48.1"
"@shopify/cli": "3.48.1"

MitchLillie · 2023-11-20T18:51:27Z

@CrowderSoup Are you still seeing this issue?

ctrlaltdylan · 2023-12-20T19:22:37Z

I'm seeing this issue as well when trying to generate a post-purchase extension through the Shopify CLI.

Here's my locked @shopify dependencies:

"@shopify/app@latest":
  version: 3.52.0

"@shopify/cli@latest":
  version: 3.52.0
  resolution: "@shopify/cli@npm:3.52.0"

Running Node v18, React 18.

Command failed with exit code 1: npm install @shopify/post-purchase-ui-extensions-react@^0.13.2 --save-prod
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: @verdict/[email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   react@"18.2.0" from @verdict/[email protected]
npm ERR!   apps/my-app
npm ERR!     @verdict/[email protected]
npm ERR!     node_modules/@verdict/my-app
npm ERR!       workspace apps/core from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@">=17.0.0 <18.0.0" from @shopify/[email protected]
npm ERR! node_modules/@shopify/post-purchase-ui-extensions-react
npm ERR!   @shopify/post-purchase-ui-extensions-react@"^0.13.2" from @verdict/my-app
npm ERR!   apps/core
npm ERR!     @verdict/[email protected]
npm ERR!     node_modules/@verdict/my-app
npm ERR!       workspace apps/my-app from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR!
npm ERR! For a full report see:
npm ERR! /home/gitpod/.npm/_logs/2023-12-20T19_19_17_374Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: /home/gitpod/.npm/_logs/2023-12-20T19_19_17_374Z-debug-0.log

From what I can tell, the @shopify/post-purchase-ui-extensions-react depends on a version of remote-react that's dependent on React v17, not the latest v18.

I suspect that might be the issue?

victor-roswell · 2024-06-20T21:31:15Z

This is still an issue. Can we do something to make the extension packages compatible with 18?

Jolsty · 2024-06-25T13:29:16Z

Yeah i'm having troubles too

AnitBishwas · 2024-12-15T06:23:40Z

I am facing the same issue

kalenjordan · 2024-12-16T14:59:47Z

Just ran into this today - @ctrlaltdylan did you end up resolving?

ctrlaltdylan · 2024-12-16T15:07:35Z

I have to jog my memory a bit. I think before I installed the Shopify CLI as a dependency in my yarn workspace. But I ran into so many issues with using shopify with yarn that I have instead started using npx shopify <command> to run things.

But I have trouble remembering exactly, my package.json's show React 18:

{
  "name": "@verdict/post-purchase",
  "private": true,
  "version": "1.0.0",
  "license": "UNLICENSED",
  "dependencies": {
    "@shopify/ui-extensions": "2024.7.x",
    "@shopify/ui-extensions-react": "2024.7.x",
    "react": "^18.0.0"
  },
  "devDependencies": {
    "@types/react": "^18.0.0",
    "react-reconciler": "0.29.0"
  }
}

kalenjordan · 2024-12-16T17:04:32Z

Ah I see thanks. I'll look into that. I think yarn is required in my case because the app I'm using is on gadget.

…

On Mon, Dec 16, 2024 at 9:07 AM Dylan Pierce ***@***.***> wrote: I have to jog my memory a bit. I think before I installed the Shopify CLI as a dependency in my yarn workspace. But I ran into so many issues with using shopify with yarn that I have instead started using npx shopify <command> to run things. But I have trouble remembering exactly, my package.json's show React 18: { "name": ***@***.***/post-purchase", "private": true, "version": "1.0.0", "license": "UNLICENSED", "dependencies": { ***@***.***/ui-extensions": "2024.7.x", ***@***.***/ui-extensions-react": "2024.7.x", "react": "^18.0.0" }, "devDependencies": { ***@***.***/react": "^18.0.0", "react-reconciler": "0.29.0" }} — Reply to this email directly, view it on GitHub <#1369 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AALYQNIQGVHPOB4CCQN5PXD2F3UE3AVCNFSM6AAAAABJUXI5XOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDKNBVHA3TKOJRHA> . You are receiving this because you commented.Message ID: ***@***.***>

-- Thanks, Kalen

ctrlaltdylan · 2024-12-16T17:17:14Z

Gotcha. Yea I still use yarn as well. But there's a lot of NPM specific hardcoded functionality in the CLI source, it really looks like it's only intended for NPM use unfortunately. npx is my workaround.

shahidshaikhs · 2024-12-19T05:06:35Z

Facing the same issue with npm as well as yarn.

ERROR  Cannot read properties of null (reading 'useState')

 node_modules/@shopify/cli-kit/node_modules/react/cjs/react.development.js:1622:21

CrowderSoup added the bug Something isn't working label Sep 21, 2023

CrowderSoup mentioned this issue Sep 21, 2023

NPM Resolution error for React #853

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Conflicting peer dependency: [email protected] #1369

Conflicting peer dependency: [email protected] #1369

CrowderSoup commented Sep 21, 2023

SaadMay0 commented Sep 28, 2023

SaadMay0 commented Sep 28, 2023

SaadMay0 commented Sep 28, 2023

dani-sanomads commented Sep 30, 2023

MitchLillie commented Nov 20, 2023

ctrlaltdylan commented Dec 20, 2023 •

edited

Loading

victor-roswell commented Jun 20, 2024

Jolsty commented Jun 25, 2024

AnitBishwas commented Dec 15, 2024

kalenjordan commented Dec 16, 2024

ctrlaltdylan commented Dec 16, 2024

kalenjordan commented Dec 16, 2024 via email

ctrlaltdylan commented Dec 16, 2024

shahidshaikhs commented Dec 19, 2024 •

edited

Loading

Conflicting peer dependency: [email protected] #1369

Conflicting peer dependency: [email protected] #1369

Comments

CrowderSoup commented Sep 21, 2023

Please list the package(s) involved in the issue, and include the version you are using

Describe the bug

Steps to reproduce the behavior:

Expected behavior

SaadMay0 commented Sep 28, 2023

SaadMay0 commented Sep 28, 2023

SaadMay0 commented Sep 28, 2023

dani-sanomads commented Sep 30, 2023

MitchLillie commented Nov 20, 2023

ctrlaltdylan commented Dec 20, 2023 • edited Loading

victor-roswell commented Jun 20, 2024

Jolsty commented Jun 25, 2024

AnitBishwas commented Dec 15, 2024

kalenjordan commented Dec 16, 2024

ctrlaltdylan commented Dec 16, 2024

kalenjordan commented Dec 16, 2024 via email

ctrlaltdylan commented Dec 16, 2024

shahidshaikhs commented Dec 19, 2024 • edited Loading

ctrlaltdylan commented Dec 20, 2023 •

edited

Loading

shahidshaikhs commented Dec 19, 2024 •

edited

Loading