Unable to build and run remix v2 with turborepo and pnpm with mixed react and react-dom versions 18-17

piyushchauhan2011 commented 1 year ago

What version of Remix are you using?

v2

Are all your remix dependencies & dev-dependencies using the same version?

[X] Yes

Steps to Reproduce

Since the bug is very specific, I replicated the scenario in this sample monorepo project

https://github.com/piyushchauhan2011/remix-v2-turborepo-pnpm-bug

The setup has mixed react and react-dom 17 and 18 versions which is I believe general scenario for most companies. After remix v2 came out, we tried to upgrade and saw the following error. After removing existing apps, it seems that if monorepo doesn't have react and react-dom 17, everything seems to work. But having both causes errors as shown.

Screenshot 2566-09-18 at 15 23 45

We noticed that if we create other new SPA app with react 18 and react-dom 18, things seems to be okay. I was wondering if we can overcome this error in possible way.

To run the above repo locally:

pnpm install and pnpm --filter=web dev

To build:

pnpm --filter=web build and pnpm --filter=web start

The docs folder represents existing app with react 17 while web app is remix with react 18. I also included a shared ui library.

Expected Behavior

Able to run, build and start the remix v2 basic app without any errors in existing turborepo monorepo setup

Actual Behavior

Results in following errors:

Screenshot 2566-09-18 at 15 30 24

Screenshot 2566-09-18 at 15 23 45

piyushchauhan2011 commented 1 year ago

I have included the example for app with react and react-dom 18 under docs-v2 to demonstrate that it works as expected but for some reason remix v2 with latest react results in error

piyushchauhan2011 commented 1 year ago

Possible issue with tsconfig.json though not sure

piyushchauhan2011 commented 1 year ago

After some struggle, I noticed there is option for custom manual dev server

piyushchauhan2011 commented 1 year ago

Seems like when we try to console.log or catch it, nothing happens but somehow it executes when we don't catch

Screenshot 2566-09-18 at 17 29 55

pcattori commented 1 year ago

Note that React 18+ is now required in v2

piyushchauhan2011 commented 1 year ago

It might be some issue with pnpm dependency resolution. I was thinking of doing other setups like turborepo with npm, yarn to recreate issue or just use pnpm workspace to see if issue still exist. I'll keep updating here

dustinsmith1024 commented 1 year ago

This hit us too. Seems to be working with a pnpm override to enforce a dep version of react-dom.

Looks like remix-run/serve should have a peer dep of react-dom. We had to add the remix-run/dev override as well because its what pulls in remix-run/serve.

Ill PR in a bit.

  "pnpm": {
    "packageExtensions": {
      "@remix-run/dev": {
        "peerDependencies": {
          "react-dom": "18.2.0"
        }
      },
      "@remix-run/serve": {
        "peerDependencies": {
          "react-dom": "18.2.0"
        }
      }
    },

piyushchauhan2011 commented 1 year ago

Having above does resolve the issue @dustinsmith1024 . Thank you 👍🏼

mayank1513 commented 1 year ago

remix-run / remix