Error while building React-Native application - react-native

How the issue appeared ?
1 - I started a new blank react-native project using react-native init projectName
2 - I moved screens and components from exiting project to the new one
3 - I installed the required npm modules that's I use inside the project (including expo) npm install --save expo
that's the error which I got "check the below image" , however I installed expo
that's my package.json file
{
"name": "taplot",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"axios": "^0.18.0",
"expo": "^29.0.0",
"native-base": "^2.7.2",
"react": "16.4.1",
"react-native": "0.56.0",
"react-native-easy-grid": "^0.2.0",
"react-native-flags": "^1.0.0",
"react-native-icon-badge": "^1.1.3",
"react-native-public-ip": "^1.0.0",
"react-native-toaster": "^1.2.2",
"react-navigation": "^2.9.3"
},
"devDependencies": {
"babel-jest": "23.4.2",
"babel-preset-react-native": "5.0.2",
"jest": "23.4.2",
"react-test-renderer": "16.4.1"
},
"jest": {
"preset": "react-native"
}
}

Related

unable to reduce react-native application's size

i made an app with expo but am not satisfied with it's size, i found this blog/tutoriel on how to reduce it using react-native init project , here is the link : https://medium.com/#aswinmohanme/how-i-reduced-the-size-of-my-react-native-app-by-86-27be72bba640
the blog says to "Install all dependencies of the Expo project except Expo specific libraries." , but since i made the app with expo i used expo-av and expo-linear-gradient,it gave me this error
error: bundling failed: Error: Unable to resolve module #unimodules/core from
node_modules/expo-av/build/ExponentAV.js`: #unimodules/core could not be found within the project.
this error was fixed after i downloaded expo into the directory, it gave me a white screen but the build was succesfull.
when i removed the expo related libaries, it gave an error (ofcourse..).
NOTE : this isn't the first time that android studio emulator gives the white screen :( , so what am i doing wrong !!
here is the current package.json , i didn't change anything else in the project directory exept from adding the js files and the assets folder.
{
"name": "fixemulatorBug",
"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": {
"expo-av": "5.0.2",
"expo-linear-gradient": "~5.0.1",
"react": "16.9.0",
"react-dom": "16.8.3",
"react-native": "0.61.3",
"react-native-drawer": "2.2.2",
"react-native-elements": "1.2.1",
"react-native-gesture-handler": "^1.5.0",
"react-native-reanimated": "^1.4.0",
"react-native-vector-icons": "^6.6.0",
"react-native-web": "0.11.7",
"react-navigation": "4.0.10",
"react-navigation-drawer": "2.2.2",
"react-navigation-stack": "^1.9.4"
},
"devDependencies": {
"#babel/core": "^7.6.4",
"#babel/runtime": "^7.6.3",
"#react-native-community/eslint-config": "^0.0.5",
"babel-jest": "^24.9.0",
"eslint": "^6.6.0",
"jest": "^24.9.0",
"metro-react-native-babel-preset": "^0.57.0",
"react-test-renderer": "16.9.0"
},
"jest": {
"preset": "react-native"
}
}

Upgrading RN project from 0.46.4 to 0.60.0 and run in VSCode result Can't get fulfillment value from any promise, all promises were rejected

Just upgraded my react-native project from version 0.46.4 to 0.60.0 using yarn or npm and run with visual studio code result following error.
[Error] Error: Can't get fulfillment value from any promise, all promises were rejected.
This is my old package.json:
{
"name": "ShoppingApp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"native-base": "2.2.1",
"react": "16.0.0-alpha.12",
"react-native": "0.46.4",
"react-native-grid-view": "https://github.com/lucholaf/react-native-grid-view.git",
"react-native-scalable-image": "https://github.com/ihor/react-native-scalable-image.git",
"react-native-tabbar-bottom": "^1.0.4",
"react-native-numeric-input": "^1.8.0",
"react-navigation": "https://github.com/Maxeh/react-navigation.git",
"rn-viewpager": "https://github.com/zbtang/React-Native-ViewPager.git"
},
"devDependencies": {
"babel-jest": "21.0.0",
"babel-preset-react-native": "3.0.2",
"jest": "21.0.1",
"react-test-renderer": "16.0.0-alpha.12"
},
"jest": {
"preset": "react-native"
}
}
And my new package.json here
{
"name": "ShoppingApp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"native-base": "^2.12.1",
"react": "^16.8.6",
"react-native": "^0.60.0",
"react-native-grid-view": "^0.4.1",
"react-native-i18n": "^2.0.15",
"react-native-numeric-input": "^1.8.0",
"react-native-scalable-image": "^0.5.1",
"react-native-tabbar-bottom": "^1.0.4",
"react-navigation": "^3.11.0",
"rn-viewpager": "^1.2.9"
},
"devDependencies": {
"babel-jest": "21.0.0",
"babel-preset-react-native": "3.0.2",
"jest": "21.0.1",
"react-test-renderer": "16.0.0-alpha.12"
},
"jest": {
"preset": "react-native"
}
}
When I build my project with Visual Studio Code, show following error.
[Error] Error: Can't get fulfillment value from any promise, all promises were rejected.
Please let me upgrade my project and build it.
I found way to upgrade.
I changed dependencies carefully like following package.json.
{
"name": "ShoppingApp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "^16.8.6",
"react-native": "^0.60.0",
"react-native-grid-view": "https://github.com/lucholaf/react-native-grid-view.git",
"react-native-numeric-input": "^1.8.0",
"react-native-scalable-image": "https://github.com/ihor/react-native-scalable-image.git",
"react-native-tabbar-bottom": "^1.0.4",
"react-native-vector-icons": "^6.6.0",
"react-navigation": "https://github.com/Maxeh/react-navigation.git",
"rn-viewpager": "https://github.com/zbtang/React-Native-ViewPager.git"
},
"devDependencies": {
"#babel/core": "^7.5.0",
"#babel/runtime": "^7.5.2",
"#react-native-community/eslint-config": "^0.0.5",
"babel-jest": "^24.8.0",
"eslint": "^6.0.1",
"jest": "^24.8.0",
"metro-react-native-babel-preset": "^0.55.0",
"react-test-renderer": "^16.8.6"
},
"jest": {
"preset": "react-native"
}
}
As you can see I removed native-base and updated dev dependencies and add babel/core.
And delete node_modules, yarn or npm again.

React-Native brand new project issues

While creating new react-native project using the cli react-native init the project gets created successfully but when running it with cli react-native run-android it started giving following error.
Error
Here is the package.json file for the newly created project.
{
"name": "TempApp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "16.4.1",
"react-native": "0.56.0"
},
"devDependencies": {
"babel-jest": "23.4.2",
"babel-preset-react-native": "5",
"jest": "23.5.0",
"react-test-renderer": "16.4.1"
},
"jest": {
"preset": "react-native"
}
}
after a long hurdle, I just replaced a package.json file from one of my old project to the new one then the new project is started running with the cli.
here is my new package.json
{
"name": "TempApp",
"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",
"react-native-checkbox": "^2.0.0",
"react-native-popup-menu": "^0.13.1",
"react-native-shared-preferences": "^1.0.0"
},
"devDependencies": {
"babel-jest": "22.4.3",
"babel-preset-react-native": "4.0.0",
"jest": "22.4.3",
"react-test-renderer": "16.3.1"
},
"jest": {
"preset": "react-native"
}
}
if you compare these json file, you can say that the project is running with slightly older version of react-native.
My question here is, is there any stable version recommendation from react-native ?

The development server returned error code: 500

I'm trying to run an android project on the android studio emulator and every time I'm getting this error message can anyone help please? I linked an image above
package.json :
{
"name": "AwesomeProjec",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"react": "16.4.1",
"react-native": "^0.55.4"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-jest": "23.4.2",
"babel-loader": "^7.1.5",
"babel-preset-react-native": "5",
"gulp-babel": "^7.0.1",
"jest": "23.4.2",
"react-test-renderer": "16.4.1"
},
"jest": {
"preset": "react-native"
}
}
Try to create the project with below command:-
react-native init ProjectName --version react-native#0.55.0

React-Native Requiring unknown module "./lib/templates/bootstrap"

I just started working with React Native. Now I am trying to get my client running however I'm facing this issue
Requiring unknown module "./lib/templates/bootstrap".If you are sure the module is there, try restarting the packager or running "npm install".
package.json
{
"name": "client",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"eslint": "^2.10.1",
"eslint-config-airbnb": "^9.0.1",
"eslint-plugin-import": "^1.8.0",
"eslint-plugin-jsx-a11y": "^1.2.0",
"eslint-plugin-react": "^5.1.1",
"react": "15.3.2",
"react-native": "^0.37.0",
"tcomb-form-native": "^0.5.0",
"whatwg-fetch": "^1.0.0"
},
"jest": {
"preset": "jest-react-native"
},
"devDependencies": {
"babel-jest": "17.0.0",
"babel-preset-react-native": "1.9.0",
"jest": "17.0.0",
"jest-react-native": "17.0.0",
"react-test-renderer": "15.3.2"
}
}
Then I tried to search the text /lib/templates/bootstrap in my project and I found it in index.android.bundle.
module.exports=LoginView;
}, "client/views/LoginView.js");
__d(559 / tcomb-form-native/index.js /, function(global, require, module, exports) {var _lib=require(560 / ./lib /);var _lib2=babelHelpers.interopRequireDefault(_lib);
var _en=require(620 / ./lib/i18n/en /);var _en2=babelHelpers.interopRequireDefault(_en);
var _bootstrap=require('./lib/templates/bootstrap');var _bootstrap2=babelHelpers.interopRequireDefault(_bootstrap);
var _bootstrap3=require(621 / ./lib/stylesheets/bootstrap /);var _bootstrap4=babelHelpers.interopRequireDefault(_bootstrap3);
Anyone can shed some lights on this ?