Develop Reference

"react-native start" works, but crashes while "react-native run-android" is ongoing, even on a fresh project (bare workflow)

Running an app (created by "expo init appName" in Bare Workflow) on Android requires to first react-native start and then react-native run-android. What happens is -
In 1st terminal, I run react-native start (tried from VS Code terminal, normal terminal, each of these as admin too). It works fine.
In 2nd terminal, I run react-native run-android and the server crashes (in 1st terminal) and the 2nd terminal can either show error or show success.
In case of success, it's no use cause the server is not working so shows that error.
Unable to load script.Make sure you are either running a Metro server or that your bundle 'index.android.bundle' is packaged correctly for release.
In case of failure the error is (in the 2nd terminal, the one running react-native run-android)
> Task :app:createDebugExpoConfig FAILED
Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/6.8/userguide/command_line_interface.html#sec:command_line_warnings
30 actionable tasks: 2 executed, 28 up-to-date
internal/fs/utils.js:307
throw err;
^
Error: ENOENT: no such file or directory, open 'D:\bareWorkflowRN\tester1PaymentsNPlacePicker\android\app\build\generated\assets\expo-constants\debug\app.config'
at Object.openSync (fs.js:476:3)
at Object.writeFileSync (fs.js:1467:35)
at Object.<anonymous> (D:\bareWorkflowRN\tester1PaymentsNPlacePicker\node_modules\expo-constants\scripts\getAppConfig.js:20:4)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
at internal/main/run_main_module.js:17:47 {
errno: -4058,
syscall: 'open',
code: 'ENOENT',
path: 'D:\\bareWorkflowRN\\tester1PaymentsNPlacePicker\\android\\app\\build\\generated\\assets\\expo-constants\\debug\\app.config'}
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:createDebugExpoConfig'.
> Process 'command 'cmd'' finished with non-zero exit value 1
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 42s
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
internal/fs/utils.js:307
and in the 1st terminal (react-native run)
events.js:292
throw er; // Unhandled 'error' event
^
Error: EPERM: operation not permitted, lstat 'D:\bareWorkflowRN\tester1PaymentsNPlacePicker\android\app\build\generated\assets\expo-constants'
Emitted 'error' event on NodeWatcher instance at:
at NodeWatcher.<anonymous> (D:\bareWorkflowRN\tester1PaymentsNPlacePicker\node_modules\sane\src\node_watcher.js:291:16)
at FSReqCallback.oncomplete (fs.js:183:21) {
errno: -4048,
code: 'EPERM',
syscall: 'lstat',
path: 'D:\\bareWorkflowRN\\tester1PaymentsNPlacePicker\\android\\app\\build\\generated\\assets\\expo-constants'
the part showing module-name "expo-constants" is NOT always the same. It varies at times, but the general structure of the error is this. for example
events.js:292
throw er; // Unhandled 'error' event
^
Error: EPERM: operation not permitted, lstat 'D:\bareWorkflowRN\tester1PaymentsNPlacePicker\node_modules\expo-error-recovery\android\build\kotlin\compileDebugKotlin\caches-jvm\jvm'
Emitted 'error' event on NodeWatcher instance at:
at NodeWatcher.<anonymous> (D:\bareWorkflowRN\tester1PaymentsNPlacePicker\node_modules\sane\src\node_watcher.js:291:16)
at FSReqCallback.oncomplete (fs.js:183:21) {
errno: -4048,
code: 'EPERM',
syscall: 'lstat',
path: 'D:\\bareWorkflowRN\\tester1PaymentsNPlacePicker\\node_modules\\expo-error-recovery\\android\\build\\kotlin\\compileDebugKotlin\\caches-jvm\\jvm'
}
I've tried (scouring the net, especially SO posts) -
a - delete node_modules and npm install
b - cd android and gradlew clean . No affect. I've tried this before react-native run and also in between the two mentioned commands.
I've tried these steps in various permutations for the last 2-3 days, but this is not solving.
I even thought that this might be due to the new expo version launch on 15th April, and maybe that's causing some versioning issues, so I tried with fresh projects made with expo init appName. No changes made to this fresh app, just tries to run it on the emulator. It works fine with expo start but if I try react-native start and react-native run-android, the same issues repeat.
One might note at this point, that the issue can be called cyclic in nature
Also, does it make sense to -
start the server react-native start
run react-native run-android, let the server crash and let the app install with error - "Unable to load script.Make sure you are either running a Metro server or that your bundle 'index.android.bundle' is packaged correctly for release."
then try react-native start again.
I think (don't know for sure) it doesn't make sense to start the server later, but out of my many efforts , this worked twice randomly. Could NOT be reproduced.
My system Windows 10
here's my package.json (it's the one generated with a fresh app and is untouched)
{
"main": "index.js",
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"expo": "~41.0.0",
"expo-splash-screen": "~0.10.2",
"expo-status-bar": "~1.0.4",
"expo-updates": "~0.5.4",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "~0.63.4",
"react-native-gesture-handler": "~1.10.2",
"react-native-reanimated": "~2.1.0",
"react-native-screens": "~3.0.0",
"react-native-unimodules": "~0.13.3",
"react-native-web": "~0.13.12"
},
"devDependencies": {
"#babel/core": "^7.9.0",
"babel-jest": "~25.2.6",
"jest": "~25.2.6",
"react-test-renderer": "~16.13.1"
},
"jest": {
"preset": "react-native"
},
"private": true
}
Any assist highly appreciated. Let me know if more information is needed

The same issue exists after expo 41 ejecting.
By looking on "no such file or directory... android\app\build\generated\assets\expo-constants\debug\app.config" output I workarounded by manual creating of the directory debug inside of the android\app\build\generated\assets\expo-constants.
And following yarn android succeded.
Note: in case of yarn android crash the debug directory should be recreated again.
P.S.: https://github.com/expo/expo-cli/blob/master/packages/config/src/Config.ts is being modified currently. So I hope this bug will be fixed soon.

Building ionic/react for android - Invalid project type "react"

I'm using #ionic/react in order to build an Android app. Everything worked fine, but I do not seem to be able to build an android version of it.
The commands
$ ionic build
$ ionic serve
$ ionic integrations enable capacitor
$ ionic cap add android
$ ionic cap open android
all give me the error message:
[ERROR] Invalid project type: react (project config: .\ionic.config.json).
Project type must be one of: angular, ionic-angular, ionic1, custom
Do I interpret this correctly that #ionic/react is not yet full supported?
I am confused, thought I built an #ionic/react-app for android before.
Been following this documentation: https://ionicframework.com/docs/react/your-first-app
My ionic.config.json:
{
"name": "Prototype",
"integrations": {},
"type": "react"
}
Important dependencies from package.json:
"dependencies": {
"#ionic/react": "^4.11.0",
"#ionic/react-router": "^4.11.0",
"#react-google-maps/api": "1.7.12",
"#types/jest": "^24.0.18",
"#types/node": "^12.7.12",
"#types/react": "^16.9.5",
"#types/react-dom": "^16.9.1",
"#types/react-router": "^5.1.1",
"#types/react-router-dom": "^5.1.0",
"ionic": "4.12.0",
"ionicons": "^4.6.3",
"react": "^16.10.2",
"react-dom": "^16.10.2",
"react-router": "^5.1.0",
"react-router-dom": "^5.1.0",
"react-scripts": "3.2.0",
"typescript": "3.6.3"
},

I got the same issue, you have to update ionic to the latest version.
npm uninstall -g #ionic/cli
npm install -g #ionic/cli#latest

React Native on Android: Unable to determine the current character, it is not a string, number, array, or object

I create a new application and insert a old code, when i build the application this error appears:
Script
'C:\Users\nameuser\Desktop\nameapp\node_modules#react-native-community\cli-platform-android\native_modules.gradle' line: 191
What went wrong:
A problem occurred evaluating settings 'nameapp'.
Unable to determine the current character, it is not a string, number, array, or object
The current character read is 'i' with an int value of 105
Unable
to determine the current character, it is not a string, number, array,
or object
line number 1
index number 0
info Run "react-native --help" to see a list of all available commands.
With react-native info command I have the current situation:
info
React Native Environment Info:
System:
OS: Windows 10
CPU: (8) x64 Intel(R) Core(TM) i7-8550U CPU # 1.80GHz
Memory: 6.46 GB / 15.85 GB
Binaries:
Yarn: 1.15.2 - C:\laragon\bin\nodejs\node-v11\yarn.CMD
npm: 6.12.0 - C:\Program Files\nodejs\npm.CMD
IDEs:
Android Studio: Version 3.5.0.0 AI-191.8026.42.35.5900203
And on the package.json:
{
"name": "nameapp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"#react-native-community/cli-platform-android": "^2.9.0",
"axios": "^0.18.0",
"haversine": "^1.1.0",
"moment": "^2.22.2",
"react": "16.6.3",
"react-native": "^0.59.8",
"react-native-actionsheet": "^2.4.2",
"react-native-auto-height-image": "^1.1.0",
"react-native-cached-image": "^1.4.3",
"react-native-cli": "^2.0.1",
"react-native-fbsdk": "^0.8.0",
"react-native-global-font": "^1.0.2",
"react-native-google-places": "^3.0.5",
"react-native-image-crop-picker": "^0.24.1",
"react-native-image-pan-zoom": "^2.1.10",
"react-native-image-placeholder": "^1.0.14",
"react-native-iphone-x-helper": "^1.2.0",
"react-native-keyboard-manager": "^4.0.13-10",
"react-native-maps": "github:react-community/react-native-maps",
"react-native-maps-super-cluster": "^1.4.1",
"react-native-modal-datetime-picker": "^5.1.0",
"react-native-open-maps": "^0.3.3",
"react-native-progress": "^3.4.0",
"react-native-push-notification": "^3.1.2",
"react-native-router-flux": "^4.0.6",
"react-native-share": "^1.2.1",
"react-native-snap-carousel": "^3.7.4",
"react-native-swiper": "^1.5.13",
"react-native-vector-icons": "^4.6.0",
"react-native-view-shot": "^2.5.0",
"react-redux": "^5.0.7",
"redux": "^3.7.2",
"redux-persist": "^4.10.1",
"redux-persist-transform-filter": "0.0.15",
"redux-thunk": "^2.2.0"
},
"devDependencies": {
"babel-jest": "23.6.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.51.1",
"react-test-renderer": "16.6.3"
},
"jest": {
"preset": "react-native"
},
"rnpm": {
"assets": [
"./src/fonts"
]
}
}
Thank for the help.

I had to delete app\build\intermediates\signing_config\debug\out\signing-config.json and now it works.
Reference: https://gitmemory.com/issue/facebook/react-native/25936/517993846

The build process executes:
npx --quiet react-native config
or
npx.cmd --quiet react-native config
That command, if you execute in the root directory of your project,
will produce JSON output (if everything is configured correctly).
Then the JSON output is parsed within the gradle script you had referenced.
When things are not configured correctly, th
npx --quiet react-native config will produce nothing, or invalid output.
So, JSON parsing (on line 191) will fail.
That whole machinery of invoking 'npx --quiet react-native config', is used in latest version of react-native, so that it will automatically 'bind' all the react native packages you have in your package.json, into your Android java app.
(it basically injects at compile time of your app, all those packages names).
--
Unfortunately, there is not a single 'workaround' that will help you to fix this problem.
You may have a missmatch (or incorrectly configured)
app/build.gradle
settings.gradle
build.gradle
versions of #react-native/community/cli in your package.json
versions of react-native that work with specific version of community-cli
react-native.config.js
Best thing I could recommend at this point is upgrade to whatever latest
React release you can afford, and then use
https://github.com/react-native-community/rn-diff-purge
to figure out all the changes you need to make the above config files between the version where it worked, and version of RN where it stopped working.
If all fails try to debug native_modules.gradle.
Go there, and insert:
this.logger.warn("cmd: ${command}, result: ${reactNativeConfigOutput}");
somewhere, after a statement that initializes reactNativeConfigOutput string variable.
This log statement will print out the command and the output of that command
that's executed by this autolinking machinery.
So when you run
gradlew build
you should see some output.
In my case the command (cmd) was:
npx.cmd --quiet react-native config
and reactNativeConfigOutput was:
info Run "react-native --help" to see a list of all available commands
you can see that the ouptut was not a valid json, and the first character was 'i' , and the JSON output parse (that's used in native_modules.gradle) threw the error that complained about 'i' not being a valid character

I spent a while on this. I ended up just removing the following 2 files, clean and rebuild.
app\build\intermediates\signing_config\debug\out\signing-config.json
app\build\intermediates\signing_config\release\out\signing-config.json

The issue is that react-native-community#^2.0.0 is only compatible with react-native#^0.59.0. (doc)
You have to upgrade react-native or downgrade react-native-community

I had a similar problem just after dumping code from GitHub. What I have found out there was a merging conflict in android/app/src/AndroidManifest.xml file.
So whenever I was trying to rebuild Android app, there was parsing error with some weird new characters.

In my case when I removed the package react-native-firebase, this problem was popping up. I removed the dependency from my react-native-config.js, so if this happens while removing a package make sure you remove everything related to this package from your folders

React Native Android assembleRelease - Error: jest-haste-map: Haste module naming collision

I have this problem when running ./gradlew assembleRelease
Error: jest-haste-map: Haste module naming collision: Duplicate module name:
react-native Paths:
/node_modules/react-native/package.json collides with
/node_modules/react-native-twitter-signin/node_modules/react-native/package.json
./gradlew assembleDebug works just fine.
Any ideas on how to solve this? I've spent like 4 hours reading github threads and none of the options seem to work...

Install the package using the code in the master branch.
npm install --save GoldenOwlAsia/react-native-twitter-signin#master
since the fix has been added to master but hasn't been published to npm yet.
The issue is due to duplicate dependencies in package.json
"dependencies": {
"react": "^16.4.2",
"react-native": "^0.56.0"
},

react-native Error: Unable to resolve module `AccessibilityInfo`

I'm new in React-native I have followed all the instruction when I try to build my first app I got this error . I have clear catch restart npm but still got this error.
The development server returned response error code: 500
URL: http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false
Body:
{"originModulePath":"F:\\React Native\\AttendenceSystem\\node_modules\\react-native\\Libraries\\react-native\\react-native-implementation.js","targetModuleName":"AccessibilityInfo","message":"Unable to resolve module `AccessibilityInfo` from `F:\\React Native\\AttendenceSystem\\node_modules\\react-native\\Libraries\\react-native\\react-native-implementation.js`: Module `AccessibilityInfo` does not exist in the Haste module map\n\nThis might be related to https://github.com/facebook/react-native/issues/4968\nTo resolve try the following:\n 1. Clear watchman watches: `watchman watch-del-all`.\n 2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.\n 3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`. 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.","errors":[{"description":"Unable to resolve module `AccessibilityInfo` from `F:\\React Native\\AttendenceSystem\\node_modules\\react-native\\Libraries\\react-native\\react-native-implementation.js`: Module `AccessibilityInfo` does not exist in the Haste module map\n\nThis might be related to https://github.com/facebook/react-native/issues/4968\nTo resolve try the following:\n 1. Clear watchman watches: `watchman watch-del-all`.\n 2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.\n 3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`. 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`."}],"name":"Error","stack":"Error: Unable to resolve module `AccessibilityInfo` from `F:\\React Native\\AttendenceSystem\\node_modules\\react-native\\Libraries\\react-native\\react-native-implementation.js`: Module `AccessibilityInfo` does not exist in the Haste module map\n\nThis might be related to https://github.com/facebook/react-native/issues/4968\nTo resolve try the following:\n 1. Clear watchman watches: `watchman watch-del-all`.\n 2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.\n 3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`. 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.\n at ModuleResolver.resolveDependency (F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\node-haste\\DependencyGraph\\ModuleResolution.js:167:1306)\n at ResolutionRequest.resolveDependency (F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\node-haste\\DependencyGraph\\ResolutionRequest.js:80:16)\n at DependencyGraph.resolveDependency (F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\node-haste\\DependencyGraph.js:237:485)\n at Object.resolve (F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\lib\\transformHelpers.js:116:25)\n at dependencies.map.result (F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:298:29)\n at Array.map (<anonymous>)\n at resolveDependencies (F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:294:16)\n at F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:159:33\n at Generator.next (<anonymous>)\n at step (F:\\React Native\\AttendenceSystem\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:239:307)"}
processBundleResult
BundleDownloader.java:285
access$200
BundleDownloader.java:37
onResponse
BundleDownloader.java:163
execute
RealCall.java:153
run
NamedRunnable.java:32
runWorker
ThreadPoolExecutor.java:1113
run
ThreadPoolExecutor.java:588
run
Thread.java:818

That error is because of your react native project version.
You have to create your project like this by this version for now --->
react-native init ProjectName --version 0.55.4
Just wait for next version of React Native to let them fix that problem.

See dependencies & devDependencies your package.json file if your find react native version 0.56 like this ---->
"react-native":"0.56.0"
in dependencies then change it to
"react-native":"0.55.4"
and in devDependencies change
"babel-preset-react-native": "5",
to
"babel-preset-react-native": "4.0.0",
and finally run
npm install

Seems like downgrading react-native version will fix the issue. Are you using the latest 0.56.1? New releases are pretty unstable especially if you are running Windows.
Downgrading to 0.55.4 should fix your problem: npm install react-native#0.55.4
You can take a look at this very similar issue: https://github.com/facebook/react-native/issues/14209

I assume you are using Windows. I got the same error lately and when I searched for it on github issues of react native, saw that people changed their package.json file. What works for my case is below, you can adapt it to your needs;
{
"name": "AwesomeProject",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "16.3.1",
"react-native": "0.55.4"
},
"devDependencies": {
"babel-jest": "22.4.4",
"babel-preset-react-native": "4.0.0",
"jest": "22.4.4",
"react-test-renderer": "16.3.1"
},
"jest": {
"preset": "react-native"
}
}
Do not forget to delete your node_modules folder first, then change your package.json similar to above, then finally run npm install.