Need help in compilation of react-native iOS app - react-native

I am relatively new to react-native and trying to compile a previously running project but not able to compile
I am facing this error while compiling the code.
** BUILD FAILED **
Installing build/Build/Products/Debug-iphonesimulator/myapp.app
An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=2):
Failed to install the requested application
An application bundle was not found at the provided path.
Provide a valid path to the desired application bundle.
Print: Entry, ":CFBundleIdentifier", Does Not Exist
Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/myapp.app/Info.plist
Print: Entry, ":CFBundleIdentifier", Does Not Exist
I have tried all solutions mentioned below
Print: Entry, ":CFBundleIdentifier", Does Not Exist
this is my package.json file
{
"name": "myapp",
"version": "0.1.0",
"private": true,
"devDependencies": {
"babel-plugin-module-resolver": "^3.1.1",
"babel-preset-react-native-stage-0": "^1.0.1",
"babel-root-slash-import": "^1.1.0",
"eslint-import-resolver-babel-module": "^4.0.0",
"eslint-plugin-import": "^2.11.0",
"jest-react-native": "^18.0.0",
"jetifier": "^1.6.3",
"prop-types": "^15.6.1",
"react-native-dotenv": "^0.1.1",
"react-test-renderer": "16.2.0"
},
"scripts": {
"start": "react-native start",
"android": "react-native run-android",
"ios": "react-native run-ios",
"test": "node node_modules/jest/bin/jest.js",
"clean": "react-native-clean-project"
},
"jest": {
"preset": "react-native"
},
"dependencies": {
"moment": "^2.22.0",
"react": "16.2.0",
"react-native": "0.52",
"react-native-clean-project": "^1.0.8",
"react-native-device-info": "^0.21.5",
"react-native-document-picker": "^2.1.0",
"react-native-firebase": "^4.2.0",
"react-native-htmlview": "^0.12.1",
"react-native-image-picker": "^0.26.7",
"react-native-mime-types": "^2.2.1",
"react-native-network-info": "^3.2.2",
"react-native-pdf": "^4.0.0",
"react-native-photo-view": "^1.5.2",
"react-native-push-notification-ce": "^3.1.3",
"react-native-swiper": "^1.5.13",
"react-native-video": "^2.3.1",
"react-native-video-preview":
"git://github.com/chadsmith/react-native-video-preview.git",
"react-native-video-processing": "^1.13.0",
"react-navigation": "^1.5.8",
"rn-fetch-blob": "^0.10.12"
}
}

Try cleaning up the build folder and deleting DerivedData folder which clears the build cache. But the main reason is that you haven't set the bundle ID for the app. Assuming you followed the link and made sure that you have one, then usually the build being cached is the issue.

I think there are 2 possible causes:
1) At some point there is some other error that is blocking the creation of the JS bundle.
Check the entire log of the build attempt carefully.
2) The bundle is generated at the incorrect path or using the incorrect index.js file.
More info here:
https://stackoverflow.com/a/57604941/1979861

Related

React Native : Error cannot find symbol com.swmansion.gesturehandler.react.RNGestureHandlerPackage

I know that many related problems already asked but still none of them worked.
Error :
> Configure project :react-native-firebase_firestore
:react-native-firebase_firestore package.json found at /home/username/StudioProjects/agl-admin/node_modules/#react-native-firebase/firestore/package.json......
> Task :app:compileDebugJavaWithJavac FAILED
/home/username/StudioProjects/agl-admin/android/app/src/main/java/com/agladmin/MainApplication.java:12: error: cannot find symbol
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
^
symbol: class RNGestureHandlerPackage
location: package com.swmansion.gesturehandler.react
/home/username/StudioProjects/agl-admin/android/app/src/main/java/com/agladmin/MainApplication.java:49: error: cannot find symbol
packages.add(new RNGestureHandlerPackage());
^
symbol: class RNGestureHandlerPackage
2 errors
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.
* 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.
....
Most Matching Question : " com.swmansion.gesturehandler.react" ERROR APPEARS
package.json
{
"name": "agl-admin",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"start": "expo start --dev-client",
"android": "expo run:android",
"ios": "expo run:ios",
"web": "expo start --web"
},
"dependencies": {
"#expo-google-fonts/poppins": "^0.2.2",
"#react-native-firebase/app": "^14.5.1",
"#react-native-firebase/firestore": "^14.5.1",
"#react-navigation/drawer": "^6.3.1",
"#react-navigation/native": "^6.0.8",
"#react-navigation/stack": "^6.1.1",
"expo": "~44.0.2",
"expo-app-loading": "^1.3.0",
"expo-font": "~10.0.4",
"expo-splash-screen": "~0.14.1",
"expo-status-bar": "~1.2.0",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "0.64.3",
"react-native-gesture-handler": "^2.3.2",
"react-native-paper": "^4.11.2",
"react-native-reanimated": "^2.4.1",
"react-native-safe-area-context": "3.3.2",
"react-native-screens": "~3.10.1",
"react-native-splash-screen": "^3.3.0",
"react-native-web": "0.17.1",
"react-navigation": "^4.4.4"
},
"devDependencies": {
"#babel/core": "^7.12.9"
},
"private": true
}
What I've :
In android\settings.gradle include ':react-native.... these two where already there
In MainAplication.java import com.swmansion.gesturehandler.react.RNGestureHandlerPackage; already there
and new RNGestureHandlerPackage() List was not there so i added.
rm -rf node_modules
npm cache clean --force
./gradlew clean
and then reinstall all.
=============== UPDATE =================
I fixed it by React downgrading to "react-native-gesture-handler": "~2.1.3"
and resting cache. T
In the new version (RNGH 2) you have to remove .react, so it's just import com.swmansion.gesturehandler.RNGestureHandlerPackage;!
Make sure added you add react-native-reanimated plugin into babel.config.js
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: ['react-native-reanimated/plugin'],
};

Unable to start a micro front-end app in single-SPA application

I am facing error while trying to start sub-app in Single-SPA application. Basically, I am trying to develop a kind of util app (sub app in Single-SPA) which contains Sockjs, Stomp-client etc. I have removed node modules and package-lock.json and installed node modules again. When I try to start application I am facing below error.
Error:
[webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
- options has an unknown property 'firewall'. These properties are valid:
object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, setupExitSignals?, static?, watchFiles?, webSocketServer? }
- options.client has an unknown property 'host'. These properties are valid:
object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
Command used for running the app : npm start
package.json
{
"name": "#sudeep/livedoc",
"scripts": {
"start": "webpack serve",
"start:standalone": "webpack serve --env standalone",
"build": "webpack --mode=production",
"analyze": "webpack --mode=production --env analyze",
"lint": "eslint src --ext js,ts,tsx",
"format": "prettier --write .",
"check-format": "prettier --check .",
"prepare": "husky install",
"test": "cross-env BABEL_ENV=test jest --passWithNoTests",
"watch-tests": "cross-env BABEL_ENV=test jest --watch",
"coverage": "cross-env BABEL_ENV=test jest --coverage"
},
"devDependencies": {
"#babel/core": "^7.14.6",
"#babel/eslint-parser": "^7.14.7",
"#babel/plugin-transform-runtime": "^7.14.5",
"#babel/preset-env": "^7.14.7",
"#babel/preset-typescript": "^7.14.5",
"#babel/runtime": "^7.14.6",
"babel-jest": "^27.0.5",
"concurrently": "^6.2.0",
"cross-env": "^7.0.3",
"eslint": "^7.29.0",
"eslint-config-prettier": "^8.3.0",
"eslint-config-ts-important-stuff": "^1.1.0",
"eslint-plugin-prettier": "^3.4.0",
"husky": "^6.0.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^27.0.5",
"jest-cli": "^27.0.5",
"prettier": "^2.3.2",
"pretty-quick": "^3.1.1",
"ts-config-single-spa": "^2.0.1",
"typescript": "^4.3.4",
"webpack": "^5.40.0",
"webpack-cli": "^4.7.2",
"webpack-config-single-spa": "^4.0.0",
"webpack-config-single-spa-ts": "^2.2.2",
"webpack-dev-server": "^3.11.2",
"webpack-merge": "^5.8.0"
},
"dependencies": {
"#types/jest": "^26.0.23",
"#types/systemjs": "^6.1.0",
"#types/webpack-env": "^1.16.0",
"fast-json-patch": "3.0.0-1",
"rxjs": "6.6.0",
"stompjs": "2.3.3",
"sockjs-client": "1.5.0"
}
}
I resolved this problem by updating "webpack-config-single-spa-ts" from 2.0.0 to 3.0.0.
The firewall option has been renamed as of webpack-dev-server v4.0.0-rc.0
You should use allowedHosts instead of firewall.
This problem has been fixed in version 4.0.0 of webpack-config-single-spa
, so upgrading this package will fix your issue as well.
I had the same situation in React.
The package.json file for the project had:
"webpack-config-single-spa-react": "2.0.0",
Therefore, when I executed
npm i
npm installed the exact required version of this component (2.0.0). It is possible to verify the installed version, if you look under
./node_modules/webpack-config-single-spa-react/package.json
I manually deleted the folder webpack-config-single-spa-react.
Edited the package.json in my project to request a version above 3.0.0:
"webpack-config-single-spa-react": "^3.0.0",
executed "npm install"
verified that at least version 3.0.0 of the package was installed by looking at:
./node_modules/webpack-config-single-spa-react/package.json
The actions above resolved the problem.
Modify in your package.json this module webpack-dev-server to 4.0.0-beta.0 and rebuild.
My versions:
packages

Metro bundler: Error: EISDIR: illegal operation on a directory, read

When I reload my bundle this exception is uncaught:
Error: EISDIR: illegal operation on a directory, read
at Object.readSync (fs.js:592:3)
at tryReadSync (fs.js:366:20)
at Object.readFileSync (fs.js:403:19)
at UnableToResolveError.buildCodeFrameMessage (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:347:17)
at new UnableToResolveError (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:333:35)
at ModuleResolver.resolveDependency (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:211:15)
at DependencyGraph.resolveDependency (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph.js:413:43)
at /home/brady/obs-websocket-app/node_modules/metro/src/lib/transformHelpers.js:317:42
at /home/brady/obs-websocket-app/node_modules/metro/src/Server.js:1471:14
at Generator.next (<anonymous>)
My package.json
{
"main": "src/index.js",
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"#types/node": "^14.14.35",
"events": "^3.3.0",
"expo": "~40.0.0",
"expo-splash-screen": "~0.8.0",
"expo-updates": "~0.4.0",
"obs-websocket-js": "^4.0.2",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "~0.64.0",
"react-native-elements": "^3.3.2",
"react-native-gesture-handler": "~1.8.0",
"react-native-reanimated": "~1.13.0",
"react-native-screens": "~2.15.0",
"react-native-unimodules": "~0.12.0",
"react-native-web": "~0.13.12"
},
"devDependencies": {
"#babel/core": "~7.9.0",
"#types/react": "~16.9.35",
"#types/react-dom": "~16.9.8",
"#types/react-native": "~0.63.2",
"babel-preset-expo": "~8.3.0",
"jest-expo": "~40.0.0",
"typescript": "~4.0.0"
},
"jest": {
"preset": "react-native"
},
"private": true
}
Replace this code in `MainApplication.java
#Override
protected String getJSMainModuleName() {
return "src/index"; <---add this
}
For IOS
// packages/myapp/ios/myapp/AppDelegate.m:56
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:#"src/index" fallbackResource:nil];
Apparently there's an issue with moving index.js to src/index.js. I moved it back to the project root and it's working fine now.
Solved by deleting and creating new android emulator...
I got same error, but all going well after I yarn global remove wml
yarn global remove wml
that save my life
if you have never install wml, just consider some other related global libs
----update-----
I got the error again even I uninstall wml staff, but I found my issue's root cause was the watchman, after run brew uninstall watchman, all going well
An old instance of the remote debugger running caused this for me. Not sure of the "whys", but if you want to kill the debugger programmatically, add this to the top of your App.tsx or whatever your top-level entry file is:
import { NativeModules } from 'react-native';
NativeModules.DevSettings.setIsDebuggingRemotely(false);
Credit to Christophe Marois over at this answer How to disable Remote JS Debugging in React-Native
If you are using create-react-native-library for native modules and getting this error. Do the following:
cd example
npx react-native start
In rootDir, yarn example run

java.lang.UnsatisfiedLinkError: couldn't find DSO to load: libfbjni.so result: 0

I created a new react-native project and added my android native module as a dependency.using official doc https://reactnative.dev/docs/native-modules-setup
When I run this I get the error with following stack trace:
java.lang.UnsatisfiedLinkError: couldn't find DSO to load: libfbjni.so result: 0
at com.facebook.soloader.SoLoader.doLoadLibraryBySoName(SoLoader.java:825)
at com.facebook.soloader.SoLoader.loadLibraryBySoName(SoLoader.java:673)
at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:611)
at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:559)
at com.facebook.soloader.NativeLoaderToSoLoaderDelegate.loadLibrary(NativeLoaderToSoLoaderDelegate.java:25)
at com.facebook.soloader.nativeloader.NativeLoader.loadLibrary(NativeLoader.java:44)
at com.facebook.jni.HybridData.<clinit>(HybridData.java:34)
at com.facebook.flipper.android.FlipperThread.run(FlipperThread.java:25)
Following is my package.json
{
"name": "albums",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"axios": "^0.19.2",
"react": "16.11.0",
"react-native": "0.62.0-rc.5",
"react-native-my-fancy-library": "../react-native-my-fancy-library/"
},
"devDependencies": {
"#babel/core": "^7.9.0",
"#babel/runtime": "^7.9.2",
"#react-native-community/eslint-config": "^1.0.0",
"babel-jest": "^25.3.0",
"eslint": "^6.8.0",
"jest": "^25.3.0",
"metro-react-native-babel-preset": "^0.59.0",
"react-test-renderer": "16.11.0"
},
"jest": {
"preset": "react-native"
}
}
I have already tried:
https://stackoverflow.com/a/61695629/9715339
https://stackoverflow.com/a/57155606/9715339
https://github.com/facebook/react-native/issues/25415
But none of these solved my issue.
I am a beginner in react-native. So I don't know what other details files I need to post here. Do let me know if you need any other files.
For me the following two solved it (I think it was the latter that did it):
Reset cache: react-native start --reset-cache
Clean Android: cd android -> ./gradlew clean
for me this is resolved after following below steps
3 steps
Up minSdk to 23
In gradle.properties add line:
android.bundle.enableUncompressedNativeLibs=false;
In your manifest file add line:
android:extractNativeLibs=true;
I had the same problem that I solved by updating build.gradle 3.5.2 to 3.5.3 by Android Strudio.
The image shows the update of the classpath in the dependencies in the build.gradle file in the android folder

Can't find variable: Store

I'm working on an react-native app since 3 months, and we're currently using v0.21.
In an attempt to upgrade the app in order to fix a bug, I:
ran brew update && brew upgrade
Made some change to package.json
ran npm install
ran npm update -g react-native-cli to get the v0.1.10 locally
At this point I tried to run the app, but either in iOS or Android, I've got the same error:
So Logically I got back to origin/master, remove my node_modules folder, and reinstalled the react-native-cli v0.1.7 ... But I've got the same error !!
My package.json looks like that:
{
"name": "XXXXXX",
"version": "0.0.1",
"private": true,
"dependencies": {
"awesome-phonenumber": "^1.0.10",
"buffer": "^3.6.0",
"immutable": "^3.7.6",
"react-native": "^0.21.0",
"react-native-animatable": "^0.5.0",
"react-native-blur": "^0.7.10",
"react-native-button": "^1.3.1",
"react-native-code-push": "^1.5.3-beta",
"react-native-date": "^1.0.3",
"react-native-device-info": "^0.6.0",
"react-native-drawer-layout": "^0.4.0",
"react-native-facebook-ios": "file:lib/react-native-facebook-ios",
"react-native-facebook-login": "^1.0.2",
"react-native-floating-label-text-input": "0.0.8",
"react-native-google-places-autocomplete": "^1.1.6",
"react-native-material-kit": "^0.2.4",
"react-native-modalbox": "^1.3.1",
"react-native-onesignal": "file:lib/react-native-onesignal",
"react-native-parallax": "^0.2.2",
"react-native-parallax-scroll-view": "^0.16.17",
"react-native-router-flux": "^2.2.6",
"react-native-scrollable-tab-view": "^0.3.5",
"react-native-sync-now-android": "file:lib/react-native-sync-now-android",
"react-native-sync-now-ios": "file:lib/react-native-sync-now-ios",
"react-native-timer-ios": "file:lib/react-native-timer-ios",
"react-native-twitter-ios": "file:lib/react-native-twitter-ios",
"react-native-twitter-login": "0.0.2",
"react-native-utils": "^1.0.1",
"react-native-vector-icons": "^1.0.3",
"react-native-webrtc": "^0.1.5",
"react-redux": "^3.1.0",
"redux": "^3.0.2",
"redux-logger": "^2.0.1",
"redux-thunk": "^1.0.0",
"rnpm": "^1.4.1"
},
"scripts": {
"start": "react-native start",
"postinstall": "sh scripts/postinstall.sh"
},
"devDependencies": {
"react-native-cli": "^0.1.7"
}
}
I'm sure the problem is in the version of my tools because everything happened after I updated them and the code is the same
Here's the versions:
Watchman 4.4.0
Flow 0.22.1
react-native-cli 0.1.7
Can someone help me with this ?
Fixed it !
Because I must have upgraded packagers, it did not like the:
export default variable = {};
It prefers:
const variable = {};
export default variable;
Lost 24 hours on this...