react-spectrum: Unable to resolve module @swc/helpers/cjs/_class_private_field_init.cjs from /Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/@react-aria/interactions/dist/main.js

Provide a general summary of the issue here

I have an error

Error: Unable to resolve module @swc/helpers/cjs/_class_private_field_init.cjs from /Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/@react-aria/interactions/dist/main.js: @swc/helpers/cjs/_class_private_field_init.cjs could not be found within the project or in these directories:
  node_modules
  ../node_modules
  ../../../node_modules
  2 | var $goTMa$react = require("react");
  3 | var $goTMa$swchelperscjs_class_private_field_getcjs = require("@swc/helpers/cjs/_class_private_field_get.cjs");
> 4 | var $goTMa$swchelperscjs_class_private_field_initcjs = require("@swc/helpers/cjs/_class_private_field_init.cjs");
    |                                                                 ^
  5 | var $goTMa$swchelperscjs_class_private_field_setcjs = require("@swc/helpers/cjs/_class_private_field_set.cjs");
  6 | var $goTMa$reactariassr = require("@react-aria/ssr");
  7 |
    at ModuleResolver.resolveDependency (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:158:15)
    at DependencyGraph.resolveDependency (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/node-haste/DependencyGraph.js:231:43)
    at Object.resolve (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/lib/transformHelpers.js:129:24)
    at resolve (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:33)
    at /Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:412:26
    at Array.reduce (<anonymous>)
    at resolveDependencies (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:411:33)
    at processModule (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:140:31)
    at async addDependency (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:230:18)
    at async Promise.all (index 2)

Not sure if some libraries connected to another libraries

but im using native-base

Im not using @swc/helpers

🤔 Expected Behavior?

it should be work and not having an error I also try to path but it show well in vscode.

😯 Current Behavior

Error: Unable to resolve module @swc/helpers/cjs/_class_private_field_init.cjs from /Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/@react-aria/interactions/dist/main.js: @swc/helpers/cjs/_class_private_field_init.cjs could not be found within the project or in these directories:
  node_modules
  ../node_modules
  ../../../node_modules
  2 | var $goTMa$react = require("react");
  3 | var $goTMa$swchelperscjs_class_private_field_getcjs = require("@swc/helpers/cjs/_class_private_field_get.cjs");
> 4 | var $goTMa$swchelperscjs_class_private_field_initcjs = require("@swc/helpers/cjs/_class_private_field_init.cjs");
    |                                                                 ^
  5 | var $goTMa$swchelperscjs_class_private_field_setcjs = require("@swc/helpers/cjs/_class_private_field_set.cjs");
  6 | var $goTMa$reactariassr = require("@react-aria/ssr");
  7 |
    at ModuleResolver.resolveDependency (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:158:15)
    at DependencyGraph.resolveDependency (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/node-haste/DependencyGraph.js:231:43)
    at Object.resolve (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/lib/transformHelpers.js:129:24)
    at resolve (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:33)
    at /Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:412:26
    at Array.reduce (<anonymous>)
    at resolveDependencies (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:411:33)
    at processModule (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:140:31)
    at async addDependency (/Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:230:18)
    at async Promise.all (index 2)

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

hmmmm I just run the app it tells me the error its your library ???

Version

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

mbp m2

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 2
  • Comments: 25 (9 by maintainers)

Commits related to this issue

Most upvoted comments

I solve mine , my issue now is within "react-native": "0.69.3"

  1. Create metro.config.js:

Create a metro.config.js file in the root directory of your React Native CLI project if it doesn’t already exist.

  1. Adjust Configuration: Open the metro.config.js file and configure Metro’s resolver to include the .cjs extension:

  2. Adjust Module Imports: Open the metro.config.js file and configure Metro’s resolver to include the .cjs extension:

module.exports = {
  resolver: {
    sourceExts: ['js', 'json', 'ts', 'tsx', 'cjs'], // Add 'cjs' as a source extension
  },
};
+67
michaelroevievictoria on Aug 10, 2023

module.exports = { resolver: { sourceExts: [‘js’, ‘json’, ‘ts’, ‘tsx’, ‘cjs’], // Add ‘cjs’ as a source extension }, }; RN version is “react-native” : “0.69.12”, it worked for me

+3
karthikeyancontus on Aug 16, 2023

@reidbarber im using react native cli

"react-native": "0.69.3",
"native-base": "3.2.2-rc.3",
+2
michaelroevievictoria on Aug 10, 2023

@reidbarber Im using react-native, actually im not sure why the error comes on this library I have already suspected that this issue is within the native-base but I try to bump up the library but the error goes still the same .

image

Can you specify which version of React Aria you’re using, and which build tool you’re using for your app?

+2
michaelroevievictoria on Aug 10, 2023

For those of you using Next.js on this thread, I reached out to the Vercel folks and they were nice enough to backport a fix to @swc/helpers that you can use with Next v12! See https://github.com/vercel/next.js/issues/48593#issuecomment-1681930868 for how to override the version with your package manager.

+1
devongovett on Aug 17, 2023

@michaelroevievictoria

RN version is “react-native”: “0.63.3”, it worked for me, thanks

+1
mengpangyu on Aug 16, 2023

@michaelroevievictoria it worked for me 😃

+1
VAIMORSS on Aug 14, 2023

Hmm. I’m not really sure what we can do here. We don’t control the @swc/helpers project, it’s just used as part of our build.

Maybe you can try to configure your version metro so it accepts .cjs files? This comment might provide a clue about how to do it. https://github.com/facebook/metro/issues/535#issuecomment-1180120485 I haven’t personally used React Native or Metro so I’m not sure how much more I can help.

+1
devongovett on Aug 10, 2023

Using ^0.71.1 of metro. React native 0.66.

Upgrading will be pretty difficult to do. Dependencies in current project are not compatible with later node.

+1
dcisneros2 on Aug 10, 2023

For what its worth (On the Next js side of this issue), we’re generating, cloning, and installing Next 12.3.2 apps on a daily basis, and I can confirm this was not an issue yesterday (I did several installs yesterday with fresh package-locks, the whole works). So if the issue thread from last month that @LFDanLu shared earlier is in fact what’s happening, I’m guessing this latest release is just a continuation of losing Next 12 support and we were just lucky until now?

+1
jakecrump on Aug 10, 2023

Seems like two different issues? One is for Next.js, which we know about already, and the other is for React Native? For the React Native folks, could you verify what version of @swc/helpers is installed? Maybe try clearing it from your lockfile and reinstalling?

+1
devongovett on Aug 10, 2023

I believe this issue is the same as this one, see this comment for more details.

+1
LFDanLu on Aug 10, 2023

Having the same issue. Unsure if it impacts other packages but specifically for me, @react-aria/button version 3.8.1 is causing the above error. I added an override to an earlier version (3.8.0) and the error goes away.

edit: upon further investigating, seems outside of the button component. Apologies.

+1
jakecrump on Aug 10, 2023
Read more comments on GitHub
← react-spectrum: Unable to load @react-aria/textfield as ESM module
react-spectrum: `usePress` / `useLink` is not compatible with NextJS's `next/link` →