Installation Trouble

[rsomani95]

Bug report

Hello, I'm new to javascript so please excuse my naivete in advance. Very excited to try out react-mosaic. I was having trouble installing after having set up a fresh react app environment. I'm not sure if the issue is with this repo or some other package. Any guidance would be much appreciated.

• Package version(s): react@17.0.2, react-mosaic latest version (attemped)
• Browser and OS versions: macOS Catalina 10.15.5, Chrome Version 90.0.4430.93

Steps to reproduce

1. npx create-react-app new-proj --template typescript
2. cd new-proj
3. npm add react-mosaic-component

Actual behavior

Full error log

``` # npm resolution error report 2021-05-12T14:16:10.519Z Found: react@17.0.2 node_modules/react peer react@"*" from @testing-library/react@11.2.6 node_modules/@testing-library/react @testing-library/react@"^11.2.6" from the root project peer react@"17.0.2" from react-dom@17.0.2 node_modules/react-dom peer react-dom@"*" from @testing-library/react@11.2.6 node_modules/@testing-library/react @testing-library/react@"^11.2.6" from the root project react-dom@"^17.0.2" from the root project peer react@">= 16" from react-scripts@4.0.3 node_modules/react-scripts react-scripts@"4.0.3" from the root project react@"^17.0.2" from the root project peer react@"16 - 18" from react-mosaic-component@5.0.0 node_modules/react-mosaic-component react-mosaic-component@"*" from the root project peer react@">= 16.14" from react-dnd@14.0.2 node_modules/react-dnd react-dnd@"^14.0.2" from react-mosaic-component@5.0.0 node_modules/react-mosaic-component react-mosaic-component@"*" from the root project Could not resolve dependency: peer react@"^16.13" from react-dnd-multi-backend@6.0.2 node_modules/react-mosaic-component/node_modules/react-dnd-multi-backend react-dnd-multi-backend@"^6.0.2" from react-mosaic-component@5.0.0 node_modules/react-mosaic-component react-mosaic-component@"*" from the root project Fix the upstream dependency conflict, or retry this command with --force, or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution. Raw JSON explanation object: { "code": "ERESOLVE", "current": { "name": "react", "version": "17.0.2", "location": "node_modules/react", "dependents": [ { "type": "peer", "name": "react", "spec": "*", "from": { "name": "@testing-library/react", "version": "11.2.6", "location": "node_modules/@testing-library/react", "dependents": [ { "type": "prod", "name": "@testing-library/react", "spec": "^11.2.6", "from": { "location": "/Users/rahulsomani/git/zz-react" } } ] } }, { "type": "peer", "name": "react", "spec": "17.0.2", "from": { "name": "react-dom", "version": "17.0.2", "location": "node_modules/react-dom", "dependents": [ { "type": "peer", "name": "react-dom", "spec": "*", "from": { "name": "@testing-library/react", "version": "11.2.6", "location": "node_modules/@testing-library/react", "dependents": [ { "type": "prod", "name": "@testing-library/react", "spec": "^11.2.6", "from": { "location": "/Users/rahulsomani/git/zz-react" } } ] } }, { "type": "prod", "name": "react-dom", "spec": "^17.0.2", "from": { "location": "/Users/rahulsomani/git/zz-react" } } ] } }, { "type": "peer", "name": "react", "spec": ">= 16", "from": { "name": "react-scripts", "version": "4.0.3", "location": "node_modules/react-scripts", "dependents": [ { "type": "prod", "name": "react-scripts", "spec": "4.0.3", "from": { "location": "/Users/rahulsomani/git/zz-react" } } ] } }, { "type": "prod", "name": "react", "spec": "^17.0.2", "from": { "location": "/Users/rahulsomani/git/zz-react" } }, { "type": "peer", "name": "react", "spec": "16 - 18", "from": { "name": "react-mosaic-component", "version": "5.0.0", "location": "node_modules/react-mosaic-component", "dependents": [ { "type": "prod", "name": "react-mosaic-component", "spec": "*", "from": { "location": "/Users/rahulsomani/git/zz-react" } } ] } }, { "type": "peer", "name": "react", "spec": ">= 16.14", "from": { "name": "react-dnd", "version": "14.0.2", "location": "node_modules/react-dnd", "dependents": [ { "type": "prod", "name": "react-dnd", "spec": "^14.0.2", "from": { "name": "react-mosaic-component", "version": "5.0.0", "location": "node_modules/react-mosaic-component", "dependents": [ { "type": "prod", "name": "react-mosaic-component", "spec": "*", "from": { "location": "/Users/rahulsomani/git/zz-react" } } ] } } ] } } ] }, "currentEdge": null, "edge": { "type": "peer", "name": "react", "spec": "^16.13", "error": "INVALID", "from": { "name": "react-dnd-multi-backend", "version": "6.0.2", "location": "node_modules/react-mosaic-component/node_modules/react-dnd-multi-backend", "dependents": [ { "type": "prod", "name": "react-dnd-multi-backend", "spec": "^6.0.2", "from": { "name": "react-mosaic-component", "version": "5.0.0", "location": "node_modules/react-mosaic-component", "dependents": [ { "type": "prod", "name": "react-mosaic-component", "spec": "*", "from": { "location": "/Users/rahulsomani/git/zz-react" } } ] } } ] } }, "peerConflict": null, "strictPeerDeps": false, "force": false } ```

[kongweiying2]

I have a similar issue:

Module not found: Can't resolve 'react/jsx-runtime' in '/Users/conwayying/programming/projects/lifemap/node_modules/react-dnd/dist/esm/core'

[promet99]

@rsomani95 Such error may be caused from low npm version. Can you tell me you npm version? You can also try updating to latest LTS version

[rsomani95]

@promet99 I tried with npm v7.12 I see 7.13 is available, I'll try with that and report back

[rsomani95]

@promet99 still getting the same error with 7.13

[promet99]

@rsomani95 whoa, my mistake. I meant NodeJS version. I hope its version is also latest LTS.

Some problem seems to be in peer dependency version of this module's dependency...

For the time being install yarn and try the following

1. delete yarn.lock and npm_modules dir
2. yarn add react-mosaic-component

[cuongvo]

Same error. Looks like it's an issue with the peer dependencies declared from react-dnd-multi-backend and react-dnd-preview version 6.0.2. See https://github.com/LouisBrunner/dnd-multi-backend/blob/v6.0.2/packages/react-dnd-preview/package.json#L23

[nomcopter]

Is this causing any issues in practice? Or just warnings on install? Peer dependency errors are a pretty common (albeit obnoxious) issue.

[nomcopter]

Might be worth trying with "react": "^16" in your dependencies