Error: While resolving module, the Haste package was found. the module could not be found within the package #35832

BraveEvidence · 2023-01-14T12:43:05Z

Description

I am trying the new arch of react native. I have enabled it in my gradle.properties file. This error is for android only and I have not tried iOS yet.

I am following the exact sample of Calculator mentioned over here.

I get an error saying

error: Error: While resolving module `rtn-calculator/js/NativeCalculator.js`, the Haste package `rtn-calculator` was found. However the module `js/NativeCalculator.js` could not be found within the package. Indeed, none of these files exist:

  * `/Users/transformhub/Desktop/rnapp/RTNCalculator/js/NativeCalculator.js(.native|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`
  * `/Users/transformhub/Desktop/rnapp/RTNCalculator/js/NativeCalculator.js/index(.native|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`
    at resolveHasteName (/Users/transformhub/Desktop/rnapp/node_modules/metro-resolver/src/resolve.js:173:9)
    at Object.resolve (/Users/transformhub/Desktop/rnapp/node_modules/metro-resolver/src/resolve.js:63:20)
    at ModuleResolver.resolveDependency (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:111:31)
    at DependencyGraph.resolveDependency (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/node-haste/DependencyGraph.js:260:43)
    at Object.resolve (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/lib/transformHelpers.js:177:21)
    at Graph._resolveDependencies (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/DeltaBundler/Graph.js:432:35)
    at Graph._processModule (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/DeltaBundler/Graph.js:218:38)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Graph._addDependency (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/DeltaBundler/Graph.js:314:20)
    at async Promise.all (index 2)

The complete repo is here

Version

0.71.0

Output of `npx react-native info`

info Fetching system and libraries information...
System:
OS: macOS 13.1
CPU: (8) x64 Apple M1
Memory: 41.52 MB / 8.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 18.12.1 - /usr/local/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 8.19.2 - /usr/local/bin/npm
Watchman: Not Found
Managers:
CocoaPods: 1.11.3 - /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1
Android SDK: Not Found
IDEs:
Android Studio: 2022.1 AI-221.6008.13.2211.9477386
Xcode: 14.2/14C18 - /usr/bin/xcodebuild
Languages:
Java: javac 16 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 18.2.0 => 18.2.0
react-native: 0.71.0 => 0.71.0
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

Download the repo from here
Do npm install
Run yarn react-native run-android --active-arch-only

Snack, code example, screenshot, or link to a repository

Repo

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

cortinico · 2023-01-19T10:01:14Z

Can you try to wipe Metro cache with yarn start --reset-cache?

BraveEvidence · 2023-01-19T11:55:41Z

Same error

error: Error: While resolving module `rtn-calculator/js/NativeCalculator.js`, the Haste package `rtn-calculator` was found. However the module `js/NativeCalculator.js` could not be found within the package. Indeed, none of these files exist:

  * `/Users/transformhub/Desktop/rnapp/RTNCalculator/js/NativeCalculator.js(.native|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`
  * `/Users/transformhub/Desktop/rnapp/RTNCalculator/js/NativeCalculator.js/index(.native|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`
    at resolveHasteName (/Users/transformhub/Desktop/rnapp/node_modules/metro-resolver/src/resolve.js:173:9)
    at Object.resolve (/Users/transformhub/Desktop/rnapp/node_modules/metro-resolver/src/resolve.js:63:20)
    at ModuleResolver.resolveDependency (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:111:31)
    at DependencyGraph.resolveDependency (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/node-haste/DependencyGraph.js:260:43)
    at Object.resolve (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/lib/transformHelpers.js:177:21)
    at Graph._resolveDependencies (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/DeltaBundler/Graph.js:432:35)
    at Graph._processModule (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/DeltaBundler/Graph.js:218:38)
    at async Graph._addDependency (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/DeltaBundler/Graph.js:314:20)
    at async Promise.all (index 2)
    at async Graph._processModule (/Users/transformhub/Desktop/rnapp/node_modules/metro/src/DeltaBundler/Graph.js:263:5)

huntie · 2023-01-19T15:10:17Z

Hi @PritishSawant! I believe this is because you have located the rtn-calculator package outside of a node_modules directory or npm/Yarn workspace. Therefore, for some internal reasons (Metro treats the directory as a legacy "Haste package") the import is handled slightly differently, and fails.

Specifically, this legacy package resolution suffixes all import subpaths based on sourceExts, and does not try the explicitly given file extension.

The fix in this case is to omit the source extension:

- import RTNCalculator from 'rtn-calculator/js/NativeCalculator.js';
+ import RTNCalculator from 'rtn-calculator/js/NativeCalculator';

I've tested this workaround locally against your repro using yarn react-native bundle, and it should be good to go.

BraveEvidence · 2023-01-20T03:06:44Z

After doing the required changes I am getting RTNCalculator as null. I changed my import to

import RTNCalculator from 'rtn-calculator/js/NativeCalculator';

I can see the rtn-calculator in my node-modules

huntie · 2023-01-20T11:30:41Z

Can you confirm you've run the TurboModule codegen for Android? Particularly these parts:

This is because I don't observe the rtn-calculator/android/build/generated/ directory in your test repo: https://github.com/PritishSawant/RnMyAppNewArch/tree/34521ea/RTNCalculator/android

BraveEvidence · 2023-01-20T13:07:08Z

I ran `./gradlew generateCodegenArtifactsFromSchema` again and it was successful but I don't see the build folder as well. The only change which I did was change the location `RTNCalculator`. It is part of my project so every time I use `yarn add ./RTNCalculator`

cortinico · 2023-01-20T13:51:18Z

again and it was successful but I don't see the build folder as well. The only change which I did was change the location RTNCalculator.

Please note that once you run generateCodegenArtifactsFromSchema the build folder you'll be looking for is: node_modules/RTNCalculator/android/build/generated/source/codegen and not the one inside your top level ../RTNCalculator folder.

If the issue persists, could you share a reproducer?

BraveEvidence · 2023-01-20T14:07:43Z

Yup I am looking in the node_modules folder. I don't see build folder in android. Below is the screenshot

The repo is here

BraveEvidence · 2023-01-22T10:15:15Z

@cortinico Do you want me to open another issue?

cortinico · 2023-01-23T12:22:05Z

Nope sorry. The issue you're facing now has already been addressed and is solved in React Native 0.71.1
If you bump the React Native version to 0.71.1 it will be solved.

Reference to the underlying issue is:
react-native-community/cli#1800

YoungLea30 · 2024-05-28T14:18:01Z

Hi @PritishSawant! I believe this is because you have located the rtn-calculator package outside of a node_modules directory or npm/Yarn workspace. Therefore, for some internal reasons (Metro treats the directory as a legacy "Haste package") the import is handled slightly differently, and fails.

Specifically, this legacy package resolution suffixes all import subpaths based on sourceExts, and does not try the explicitly given file extension.

The fix in this case is to omit the source extension:
- import RTNCalculator from 'rtn-calculator/js/NativeCalculator.js';
+ import RTNCalculator from 'rtn-calculator/js/NativeCalculator';
I've tested this workaround locally against your repro using yarn react-native bundle, and it should be good to go.

it helped me, thankyou!

BraveEvidence added Needs: Triage 🔍 Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules) labels Jan 14, 2023

cortinico added Needs: Author Feedback and removed Needs: Triage 🔍 labels Jan 19, 2023

github-actions bot added Needs: Attention Issues where the author has responded to feedback. and removed Needs: Author Feedback labels Jan 19, 2023

huntie closed this as completed Jan 19, 2023

huntie mentioned this issue Jan 19, 2023

Fix import in Turbo Native Modules sample code facebook/react-native-website#3524

Merged

cortinico removed the Needs: Attention Issues where the author has responded to feedback. label Jan 20, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Error: While resolving module, the Haste package was found. the module could not be found within the package #35832

Error: While resolving module, the Haste package was found. the module could not be found within the package #35832

BraveEvidence commented Jan 14, 2023

cortinico commented Jan 19, 2023

BraveEvidence commented Jan 19, 2023

huntie commented Jan 19, 2023 •

edited

Loading

BraveEvidence commented Jan 20, 2023

huntie commented Jan 20, 2023

BraveEvidence commented Jan 20, 2023

cortinico commented Jan 20, 2023

BraveEvidence commented Jan 20, 2023

BraveEvidence commented Jan 22, 2023

cortinico commented Jan 23, 2023

YoungLea30 commented May 28, 2024

Error: While resolving module, the Haste package was found. the module could not be found within the package #35832

Error: While resolving module, the Haste package was found. the module could not be found within the package #35832

Comments

BraveEvidence commented Jan 14, 2023

Description

Version

Output of npx react-native info

Steps to reproduce

Snack, code example, screenshot, or link to a repository

cortinico commented Jan 19, 2023

BraveEvidence commented Jan 19, 2023

huntie commented Jan 19, 2023 • edited Loading

BraveEvidence commented Jan 20, 2023

huntie commented Jan 20, 2023

BraveEvidence commented Jan 20, 2023

cortinico commented Jan 20, 2023

BraveEvidence commented Jan 20, 2023

BraveEvidence commented Jan 22, 2023

cortinico commented Jan 23, 2023

YoungLea30 commented May 28, 2024

Output of `npx react-native info`

huntie commented Jan 19, 2023 •

edited

Loading