3

I am trying to upgrade my project from RN v0.61.4 to v0.63.4. I am able to run debug builds on android but release builds are throwing 1 error in gradle task :app:bundleReleaseJsAndAssets

Stacktrace

(node:77926) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
/Users/me/Documents/GitHub/MyProject/android/react-native/node_modules/react-native/index.js:13
import typeof AccessibilityInfo from './Libraries/Components/AccessibilityInfo/AccessibilityInfo';
^^^^^^

SyntaxError: Cannot use import statement outside a module
at wrapSafe (internal/modules/cjs/loader.js:1117:16)
at Module._compile (internal/modules/cjs/loader.js:1165:27)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1221:10)
at Module.load (internal/modules/cjs/loader.js:1050:32)
at Function.Module._load (internal/modules/cjs/loader.js:938:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
at internal/main/run_main_module.js:17:47

My project structure is a bit different from usual. As the react native root folder lies inside android root folder. I have made necessary changes in app/build.gradle to handle that.

I even tried creating a fresh project with similar structure as mine and I am still getting this issue.

Attaching minimum reproducible code for the same.

Sample Project

Steps to reproduce

cd react-native
npm i
npx react-native run-android --variant=release
Rishabh876
  • 3,010
  • 2
  • 20
  • 37

2 Answers2

3

Ok I figured it out. It was the CLI path that was wrong in app/build.gradle replaced

cliPath : "node_modules/react-native",

with

cliPath : "node_modules/react-native/cli.js",
Rishabh876
  • 3,010
  • 2
  • 20
  • 37
1

Verify that you have the latest version of Node.js installed (or, at least 13.2.0+).

The main reason behind getting this error is that we have used the ES6 feature for importing our module but our NodeJS package.json doesn’t know about it. All we need to do is to set our type module in our package.json file.

In your package.json file, you should try:

{
    ...
    "type" : "module"
    ...
}

E.g.:

enter image description here

If that doesn't work:

Explicitly name files with the .mjs extension. All other files, such as .js will be interpreted as CommonJS, which is the default if type is not defined in package.json.

Relevant sources:

DialFrost
  • 1,610
  • 1
  • 8
  • 28
  • This is happening in node_module/react-native package. I don't think modifying its package.json is the solution here. Babel should take care of this but somehow its not working. – Rishabh876 Aug 16 '22 at 06:16
  • Try my second option? Thanks for informing me that it doesn't work! :3 @Rishabh876 – DialFrost Aug 16 '22 at 06:21