Unable to resolve "@tanstack/react-pacer/throttler" from React Native Expo App

[Andres6936]

TanStack Pacer version

v0.2.0

Framework/Library version

v18.3.1

Describe the bug and the steps to reproduce it

Exist support of this library with Expo React Native?

Your Minimal, Reproducible Example - (Sandbox Highly Recommended)

https://github.com/Andres6936/N7-Empleo-Bootstrap/tree/master/app-scanner

Screenshots or Videos (Optional)

No response

Do you intend to try to help solve this bug with your own PR?

None

Terms & Code of Conduct

• I agree to follow this project's Code of Conduct
• I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

[KevinVandy]

Does the top level @tanstack/react-pacer import work?

[Andres6936]

With

import {useThrottler} from '@tanstack/react-pacer'

I get

Android Bundling failed 10270ms node_modules\expo-router\entry.js (3788 modules)
Unable to resolve "@tanstack/pacer/async-debouncer" from "node_modules\@tanstack\react-pacer\dist\cjs\async-debouncer\useAsyncDebouncer.cjs"

[KevinVandy]

Someone who knows React Native packaging would have to weigh in. This repo is using the normal ESM and CJS build processes that all of the other TanStack repos follow. We are just also providing a lot of extra optional deep import paths too.

[johnnyrwest]

Facing a very similar issue here with RN Expo:

[Andres6936]

Now update to 0.8.0 and the problem is same:

Android Bundling failed 25581ms node_modules\expo-router\entry.js (3791 modules)
Unable to resolve "@tanstack/pacer/async-queuer" from "node_modules\@tanstack\react-pacer\dist\cjs\async-queuer\useAsyncQueuer.cjs"

Is possible a conflict resolution module of Metro (Expo's bundler) to try resolve the import?

[Andres6936]

I have copied the code from @tanstack/react-pacer and placed it inside my project, however, the problem still persists:

Android Bundling failed 2059ms node_modules\expo-router\entry.js (3645 modules)
Unable to resolve "@tanstack/pacer/throttler" from "own-pacer\throttler\useThrottler.ts"

It seems to be more of an issue with @tanstack/pacer having a bad configuration or Metro Bundler trying to resolve the dependency.

[KevinVandy]

Now update to 0.8.0 and the problem is same:

I haven't been actively trying to solve this yet. If we do fix it, it will be in the changelog.

Might this have something to do with our ESM target? Or is the CJS configuration actually wrong?

[anilanar]

We have a similar problem but for Typescript. When I import useAsyncDebouncer, it has any type for options/return value because:

1. Typescript can't resolve import '@tanstack/pacer/async-debouncer'; that is in @tanstack/react-pacer/dist/esm/async-debouncer.
2. I have skipLibCheck: true in tsconfig so TS doesn't even complain.

I think this happens because we still use moduleResolution: node and not node16 or bundler.

[lirobinxc]

I ran into a somewhat similar import issue in Tanstack Form a while back. Take a look if this helps: TanStack/form#1414