Issues when separating react-queries into a nx monorepo library

[vendramini]

Current Behavior

My setup is a nx monorepo with an Expo apps/myapp and libs/hooks shared library.

During development there's no error. But when I compile the apk's final version, it crashes as soon it is opened because react-query complains that there are no client instantiated. It happens that there is, and only one. I've filed an issue on their repo but they said that the problem is during the bundling process.

Expected Behavior

react-query shouldn't be shipped twice nor react. (Accordingly to them, this is the probable cause).

GitHub Repo

https://github.com/vendramini/nx-rq-test

Steps to Reproduce

1. nx run-android myapp: it works, you will see both fetches on the screen (local one and another one from lib).
2. nx build myapp --local --platform=android: compile successfully, but crashes when opening it.

Nx Report

NX   Report complete - copy this into the issue template

Node           : 22.0.0
OS             : darwin-arm64
Native Target  : aarch64-macos
npm            : 10.8.1

nx (global)        : 19.0.0
nx                 : 19.6.1
@nx/js             : 19.6.1
@nx/jest           : 19.6.1
@nx/linter         : 19.6.1
@nx/eslint         : 19.6.1
@nx/workspace      : 19.6.1
@nx/devkit         : 19.6.1
@nx/eslint-plugin  : 19.6.1
@nx/expo           : 19.6.1
@nx/playwright     : 19.6.1
@nx/react          : 19.6.1
@nrwl/tao          : 19.6.1
@nx/vite           : 19.6.1
@nx/web            : 19.6.1
@nx/webpack        : 19.6.1
typescript         : 5.3.3
---------------------------------------
Registered Plugins:
@nx/expo/plugin
@nx/eslint/plugin
@nx/jest/plugin
@nx/playwright/plugin

Failure Logs

No response

Package Manager Version

No response

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

React Query issue: TanStack/query#7927

[vendramini]

I've fixed the problem isolating react-query imports into libs/hooks. More details on the original issue here: TanStack/query#7927

Does it means that nx is bundling wrongly? I can't use react-query into two different projects. Apparently it ships 2 versions of it or some kind of conflict...

[xiongemi]

i figure out the issue and submit a pr to your repo: vendramini/nx-rq-test#1

essentially, what happens is that when build using eas, it does install at your project root and symlink the node_modules folder from project root to workspace root. i guess that is why it does not bundle react query package correctly.

what I did to fix it was:

• in workspace root package.json, add field "workspaces" and include the your app, something like:

  "workspaces": [
    "apps/*",
    "libs/*"
  ],

• then project package.json, remove scripts eas-build-pre-install and eas-build-post-instal like:

    "eas-build-pre-install": "cd ../../ && node tools/scripts/eas-build-pre-install.mjs . apps/myapp && cp package-lock.json apps/myapp",
    "eas-build-post-install": "cd ../../ && node tools/scripts/eas-build-post-install.mjs . apps/myapp",

now I tried to build android and it seems work for me: nx build myapp --local --platform=android --profile=preview

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.