react-native init AwesomeProject - fails to build - react-native

I cannot get a vanilla react-native project to build immediately after running react-native init. I have not made any changes to the project, nor run other commands.
Commands/output:
> react-native init AwesomeProject
> cd AwesomeProject
> react-native run-ios
....
** BUILD FAILED **
The following commands produced analyzer issues:
Analyze Base/RCTModuleMethod.mm normal x86_64
Analyze RCTVibration.m normal x86_64
(2 commands with analyzer issues)
The following build commands failed:
CompileC build/RCTVibration.build/Debug-iphonesimulator/RCTVibration.build/Objects-normal/x86_64/RCTVibration.o RCTVibration.m normal x86_64 objective-c com.apple.compilers.llvm.clang.1_0.compiler
(1 failure)
Installing build/Build/Products/Debug-iphonesimulator/AwesomeProject57.app
An error was encountered processing the command (domain=com.apple.CoreSimulator.SimError, code=164):
Unable to lookup in current state: Shutdown
Print: Entry, ":CFBundleIdentifier", Does Not Exist
Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/AwesomeProject57.app/Info.plist
Print: Entry, ":CFBundleIdentifier", Does Not Exist
Error: Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/AwesomeProject57.app/Info.plist
Print: Entry, ":CFBundleIdentifier", Does Not Exist
at checkExecSyncError (child_process.js:601:13)
at Object.execFileSync (child_process.js:621:13)
at Promise.then (/Users/local/common/native-attempt/AwesomeProject57/node_modules/react-native/local-cli/runIOS/runIOS.js:208:5)
at <anonymous>
Mac OS X: 10.3.4
XCode: 9.4.1
react-native: 0.57
react: 16.5.0
package.json:
{
"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.5.0",
"react-native": "0.57.0"
},
"devDependencies": {
"babel-jest": "23.6.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.45.2",
"react-test-renderer": "16.5.0"
},
"jest": {
"preset": "react-native"
}
}
After looking around StackOverflow, I tried:
rm -rf node_modules
rm -fr $TMPDIR/react-*
watchman watch-del-all
Using react-native run-ios still failed. FWIW, I did open the project in XCode and tried to build it there. I received a build error "/Users/local/common/native-attempt/AwesomeProject/node_modules/react-native/Libraries/Text/RawText/RCTRawTextViewManager.h:8:9: 'React/RCTViewManager.h' file not found". Different error, but I assume it is related.
Really pulling my hair out... any help appreciated.

Related

Next.js - yarn dev: error Command failed with signal "SIGSEGV"

I am having this problem, whenever I am running yarn dev or npm run dev:
yarn run v1.22.10
warning ../../../../package.json: No license field
$ next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info - Using webpack 5. Reason: no next.config.js https://nextjs.org/docs/messages/webpack5
event - compiled successfully
event - build page: /
wait - compiling...
error Command failed with signal "SIGSEGV".
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
package.json:
{
"name": "nextjs",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start"
},
"dependencies": {
"next": "^10.2.3",
"react": "17.x",
"react-dom": "17.x",
"webpack": "^5.39.1"
},
"devDependencies": {
"webpack-cli": "^4.7.2"
}
}
Appears to be a problem with Mac M1, as #Fernando Gomes commented.
In order to get it working on my environment, I am using Docker with following parameters:
docker buildx build --platform linux/amd64 .

How do you deploy api made with express in create react app

I have a simple api created with express.js. When ever i try to push to Heroku it get stuck at this point?
remote: [4/4] Building fresh packages...
remote: Done in 16.30s.
remote:
remote: -----> Build
remote: Running build (yarn)
remote: yarn run v1.22.4
remote: $ node server.js
remote: Server started on port 9000
I also see the same thing in heroku dashboard "View build progress"
here is my package.json
{
"name": "firebase-server",
"version": "1.0.0",
"main": "index.js",
"repository": "##########",
"author": "#######",
"license": "MIT",
"scripts": {
"start": "nodemon --ext js,graphql --ignore data/ server.js",
"build": "node server.js"
},
"dependencies": {
"#firebase/app": "^0.6.7",
"#firebase/component": "^0.1.15",
"apollo-server-express": "^2.15.1",
"body-parser": "^1.19.0",
"cors": "^2.8.5",
"express": "^4.17.1",
"express-jwt": "^6.0.0",
"firebase": "^7.15.5",
"graphql": "^15.3.0",
"jsonwebtoken": "^8.5.1",
"notarealdb": "^0.2.2"
},
"devDependencies": {
"nodemon": "^2.0.4"
}
}
the only thing i have in this project is my server.js. what am i missing or not doing. Basically i trying to deploy this to have a live API for my project. it is working locally but now i would like to have it working live on heroku.
With Heroku, the build script is used if you need to customize your build options (e.g. if you're using WebPack or TypeScript). The issue is that you're using a script called build, which you're expecting to start the application. It's running that script, as it promises to do, but since it's starting the application, it'll "hang forever" from your point of view.
If you change your scripts to this, I think this will solve your issues. Locally, you would use npm local for nodemon, and npm start would start the app on Heroku.
{
"scripts": {
"local": "nodemon --ext js,graphql --ignore data/ server.js",
"start": "node server.js"
},
}

Once i create and use own module then it will gives error like: Unable to resolve module

I am new in react-native and I have, for the first time, created my own module(npm).
I have tried to create my own module(npm) for common components and individually it works fine. However once I install, link it in our app, and try to use those components, it gives an error like this:
Unable to resolve module `<Module-name>` from `<file>`: Module `<Module-name>` does not exist in the Haste module map.
(Note: I have tested using Android Emulator only)
I have followed the below steps for module and test app creation
For Module
react-native init <module-name>
Add simple code of component in main index.js
And set pacakge.json like this:
{
"name": "<module-name>",
"version": "0.0.1",
"private": true,
"main": "index.js",
"scripts": {
"start": "react-native start",
"test": "jest",
"lint": "eslint .",
"build": "echo 'build script executed'"
},
"dependencies": {
"react": "16.8.6",
"react-native": "0.60.4"
},
Now I check this component (react-native run-android), it will work fine.
Now I have tried to use in an app with the below steps
For Test App
Create new fresh app (react-native init <app-name>)
Install created npm with full path like;
npm install <full path of component>
Now I try react-native link <full path of component>, I have also tried simple react-native link, but nothing happens.
Now I run app using react-native run-android, however every time it gives the same error like;
Unable to resolve module <created-module name>
test app package.json
{
"name": "<app-name>",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"react": "16.8.6",
"react-native": "0.60.4",
"react-native-my-library": "^1.0.2",
"<created-module-name>": "file:../<created-module-name>"
},
"devDependencies": {
"#babel/core": "7.5.5",
"#babel/runtime": "7.5.5",
"#react-native-community/eslint-config": "0.0.3",
"babel-jest": "24.8.0",
"eslint": "6.1.0",
"jest": "24.8.0",
"metro-react-native-babel-preset": "0.54.1",
"react-test-renderer": "16.8.6"
},
"jest": {
"preset": "react-native"
}
}
Created module successfully installed but I think it is not linked properly and it will gives error.
So what is wrong here ?
Please give me suggestion / help.
Thanks.
I am assuming your module is successfully published in npm repository. Otherwise you can not use npm install <full path of component>.
If you are using
npm install <full path of component>
command for installing your module to a Test App from npm repo. Specify in your package.json like
"<created-module-name>": "file:../<created-module-name>"
is wrong. You need to remove that line from your package.json and try to install like;
npm install --save <full path of component>
This will automatically create a line in your package.json. You can now manually link your module.
For manual linking you can follow that guide.
Edited:
If you are using in your local computer,
Then no need to npm install.
Just copy your module into your project node_modules folder.
Then in you package.json add;
"dependencies": {
...
"your_module_name": "your_module_version"
...
}
Then, you just follow the manual linking process that I mentioned above.

Can't integrate react-native-maps for react-native app

I'm new to react-native and when I tried to integrate the react-native-maps with my react native app it's giving the following error.
FAILURE: Build failed with an exception.
* Where:
Settings file 'D:\React-Projects\Native\ReactNativeMaps\android\settings.gradle' line: 3
* What went wrong:
Could not compile settings file 'D:\React-Projects\Native\ReactNativeMaps\android\settings.gradle'.
> startup failed:
settings file 'D:\React-Projects\Native\ReactNativeMaps\android\settings.gradle': 3: unexpected char: '\' # line 3, column 111.
node_modules\react-native-maps\lib\andro
^
1 error
This is my build.gradle dependencies array.
dependencies {
implementation project(':react-native-maps'){
exclude group: 'com.google.android.gms', module: 'play-services-base'
exclude group: 'com.google.android.gms', module: 'play-services-maps'
}
implementation 'com.google.android.gms:play-services-base:12.0.0'
implementation 'com.google.android.gms:play-services-maps:12.0.0'
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
implementation "com.facebook.react:react-native:+" // From node_modules
}
And this is my settings.gradle file content.
rootProject.name = 'ReactNativeMaps'
include ':react-native-maps'
project(':react-native-maps').projectDir = new File(rootProject.projectDir, '..\node_modules\react-native-maps\lib\android')
include ':app'
In case someone need to see the full error,
$ react-native run-android
Starting JS server...
Building and installing the app on the device (cd android && gradlew.bat installDebug)...
FAILURE: Build failed with an exception.
* Where:
Settings file 'D:\React-Projects\Native\ReactNativeMaps\android\settings.gradle' line: 3
* What went wrong:
Could not compile settings file 'D:\React-Projects\Native\ReactNativeMaps\android\settings.gradle'.
> startup failed:
settings file 'D:\React-Projects\Native\ReactNativeMaps\android\settings.gradle': 3: unexpected char: '\' # line 3, column 111.
node_modules\react-native-maps\lib\andro
^
1 error
* 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 1s
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/getting-started.html
Command failed: gradlew.bat installDebug
Error: Command failed: gradlew.bat installDebug
at checkExecSyncError (child_process.js:616:11)
at Object.execFileSync (child_process.js:634:13)
at runOnAllDevices (D:\React-Projects\Native\ReactNativeMaps\node_modules\react-native\local-cli\runAndroid\runAndroid.js:299:19)
at buildAndRun (D:\React-Projects\Native\ReactNativeMaps\node_modules\react-native\local-cli\runAndroid\runAndroid.js:135:12)
at isPackagerRunning.then.result (D:\React-Projects\Native\ReactNativeMaps\node_modules\react-native\local-cli\runAndroid\runAndroid.js:65:12)
at process._tickCallback (internal/process/next_tick.js:68:7)
I've installed the react-native-map also via following commands and link it also.
npm install --save react-native-maps
react-native link react-native-maps
And this is the package.json file.
{
"name": "ReactNativeMaps",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "16.6.3",
"react-native": "0.58.4",
"react-native-maps": "^0.23.0"
},
"devDependencies": {
"babel-core": "7.0.0-bridge.0",
"babel-jest": "24.1.0",
"jest": "24.1.0",
"metro-react-native-babel-preset": "0.51.1",
"react-test-renderer": "16.6.3"
},
"jest": {
"preset": "react-native"
}
}
What went wrong? Did I miss something?
In your package.json change the react-native-maps as follows:
"react-native-maps": "https://github.com/react-community/react-native-maps.git"
In settings.gradle make sure your line 3 is:
project(':react-native-maps').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-maps/lib/android')
Check if this works.
I found the problem. The reason that the build is the API_KEY. I replace the api-key with new api key and its working now. As well as change the line
project(':react-native-maps').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-maps/lib/android')
also

bundling error on react native app (ambigous resolution)

Bundling `index.js` [development, non-minified] 0.0% (0/1), failed.
error: bundling failed: ambiguous resolution: module `C:\Users\mtlok\Desktop\RN2\pep_beta\index.js` tries to require `react-native`, but there are several files providing this module. You can delete or fix them:
* `C:\Users\mtlok\Desktop\RN2\pep_beta\node_modules\react-native-responsive-dimensions\node_modules\react-native\package.json`
* `C:\Users\mtlok\Desktop\RN2\pep_beta\node_modules\react-native\package.json`
Im getting this error when bundling react-native app.
This issue may be caused by the react-native-responsive-dimensions package
Here is the package.json file:
{
"name": "react-native-responsive-dimensions",
"version": "1.0.1",
"description": "Resposive fontSize, height and width for your react-native components.",
"main": "src/index.js",
"scripts": {
"start": "node src/index.js",
"test": "exit 0"
},
"keywords": [
"react-native",
"responsive",
"responsive-height",
"responsive-width",
"responsive-font-size",
"fontSize",
"responsive-dimensions"
],
"author": "DaniAkash <s.daniakash#gmail.com> (https://github.com/DaniAkash)",
"repository": "DaniAkash/react-native-responsive-dimensions",
"license": "MIT",
"dependencies": {
"react-native": "x"
}
}
Also, there is a node_modules folder located inside node_modules/react-native-responsive-dimensions.
Is there a quick fix?
Try this command. maybe it's because of cache.
yarn start -- --reset-cache
or
npm start -- --reset-cache
if it doesn't work you can try react-native-git-upgrade or you can just delete node_modules folder then run npm install,react-native upgrade ande react-native-link
You can uninstall react-native-responsive-dimensions package first.
npm uninstall react-native-responsive-dimensions --save
And then
yarn start -- --reset-cache or npm start -- --reset-cache
react-native run-android or react-native run-ios