I was Working in RN 0.69.2 version. Yesterday I have upgrade it to RN 0.70 version.
I followed the guideline in React native helper. But I got error in Metor, it's says unable to resolve module './app.json'. when I tried to npm start --reset-cache I got other error which says
References Error sha-1 .
I tried all solutions in stackoverflow but the Error wasn't solved.
I'm having the same issue, able to resolve it by adding json at the end of metro.config.js file under resolvers like this
resolver: {
sourceExts: ['jsx', 'js', 'ts', 'tsx', 'json'], //add here
}
Hi there I am integrating google pay api using react-native-gpay but I have got an issue
Steps to install react-native-gpay
1- npm i react-native-gpay
2- react-native link react-native-gpay
3- Added in dependency block of android/app/build.gradle compile project(':react-native-gpay')
4- added import com.reactlibrary.RNGpayPackage; in MainActivity.java
5- Replaced getPackages method in MainApplication.java with below code() >
protected List<ReactPackage> getPackages() {
#SuppressWarnings("UnnecessaryLocalVariable")
List<ReactPackage> packages = new PackageList(this).getPackages();
packages.add(new RNGpayPackage()); // added a package in the list returned by getPackages()
return packages;
}
and also imported in MainApplication.java import com.reactlibrary.RNGpayPackage;
6- My settings.gradle
rootProject.name = 'Pmt'
include ':react-native-gpay'
project(':react-native-gpay').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gpay/android')
apply from: file("../node_modules/#react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'
I checked on GitHub too to resolve the issue like this
But I couldn't find any answer. I am getting the following issue in my console
* What went wrong:
Could not determine the dependencies of task ':app:compileDebugJavaWithJavac'.
> Could not resolve all task dependencies for configuration ':app:debugCompileClasspath'.
> Could not resolve project :react-native-gpay.
Required by:
project :app
> Unable to find a matching configuration of project :react-native-gpay:
- None of the consumable configurations have attributes.
This is my problem.
A problem occurred configuring project ':react-native-vector-icons'.
Could not resolve all dependencies for configuration ':react-native-vector-icons:classpath'.
Could not load module metadata from C:\Users\erick.gradle\caches\modules-2\metadata-2.71\descriptors\com.android.tools.build\gradle-api\3.3.1\fc7e8eef251519086b6ee9788cba4dd2\descriptor.bin
Please refer to this to see if there are any missing parts.
Edit android/app/build.gradle
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
Edit android/settings.gradle to look like this (without the +):
+ include ':react-native-vector-icons'
+ project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
Edit android/app/build.gradle (note: app folder) to look like
this:
dependencies {
+ implementation project(':react-native-vector-icons')
}
Edit your MainApplication.java (deep in
android/app/src/main/java/...) to look like this (note two places to
edit):
package com.myapp;
+ import com.oblador.vectoricons.VectorIconsPackage;
....
#Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage()
+ , new VectorIconsPackage()
);
}
}
in React Native > 0.60, you do not need to link packages manually. All you need is install your package and run link command. for react-native-vector-icons, remove any code and files you added to android or ios manually, or run react-native unlink react-native-vector-icons.
Remember that for ios, you need to get the last update of cocopods. if you have problem again, in ios folder run pod install command.
I hope this can help you.
react-native: 0.60.4,
react: 16.8.6,
npm: 6.10.1
XCode: 10.2.1
AndroidStudio: 3.4.1
I created a project using
npx react-native init awesomeApp --template typescript
I have put my assets in the
assets/fonts/<Bunch of .ttf files>
My Directory Structure
awesomeApp
|
+--android
+--ios
+--assets
| |
| +---fonts
| |
| +-- ProximaNova-Bold.ttf
+--react-native-config.js
then I ran
react-native link
Nothing happends, XCode not showing any added Resource neither the android, and when I'm running react-native run-ios showing error that the font is not found.
My react-native-config.js
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./assets/fonts']
};
I have also tried
yarn react-native link and npx react-native link
Well,
finally, I linked my fonts,
I just renamed my file react-native-config.js to react-native.config.js and it worked.
I don't know if this is the right way, I just tried and it worked, for me at least.
Here is the complete walkthrough for linking custom fonts.
my react-native.config.js
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./assets/fonts/'],
};
and logs:
info Linking assets to ios project
info Linking assets to android project
success Assets have been successfully linked to your project
but My mistake was:
Wrong way:
fontFamily: BYekan
Right way:
fontFamily: 'BYekan'
just put font name in ''
For React-native > 0.69, npx react-native link is no longer working
Use npx react-native-asset instead
Just to complement keyserfaty's answer, here is my react-native.config.js working using react-native link:
module.exports = {
dependencies: {
"react-native-gesture-handler": { platforms: { android: null, ios: null } }
},
assets: ['./src/assets/fonts']
};
Create a file in your react native project called react-native.config.js:
In it, paste
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./src/assets/fonts/'],
};
assets: ['./src/assets/fonts/'], should be the path to wherever you stored your custom fonts in your project folder.
When you run the link command, it should work then.
Using RN 0.60.8 with a react-native-config.js file should allow you to link your fonts using react-native link.
My logs:
react-native link
info Linking assets to ios project
info Linking assets to android project
success Assets have been successfully linked to your project
Since you installed React Native using npx I'm guessing you maybe don't have react-native installed globally? Is running react-native link giving you any errors?
None of the above solutions work for me. The issue with what I was having is my Xcode project already had Resources group with a backed folder in it. The way react-native link is working as my understanding is it's creating a group without a folder and add it to your project and link to all your fonts from there. This approach doesn't work when you already have a Resources folder. The solution I could come up with was just renaming the Resources folder to something else and run react-native link again.
If you don't have such a setup, create react-native.config.js file and running react-native link works fine.
react-native.config.js
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./src/assets/fonts/']
};
change assets: ['./src/assets/fonts/'] to assets: ['/src/assets/fonts/']
or use
assets: ['./src/assets/fonts/'] but nameProject/assets
some times you have writed react-native.config.js correctlly
in such cases ; if you do this tasks
it helps you
1- delete react-native.config.js file
2- create this file with same code again
3- write react-native link in console
then you can see resources folder in Xcode
and you can see your fonts in info.plist and copy bundle resources
The "adding the font" should be done in your package.json. Add:
"rnpm": {
"assets": ["./assets/fonts/"]
}
Then run
react-native link
Source
EDIT: The above only works for react-native below 0.60.0
I am getting following error
FAILURE: Build failed with an exception.
* Where:
Settings file 'G:\ReactNative\Contacts\android\settings.gradle' line: 3
* What went wrong:
Could not compile settings file 'G:\ReactNative\Contacts\android\settings.gradle'.
> startup failed:
settings file 'G:\ReactNative\Contacts\android\settings.gradle': 3: unexpected char: '\' # line 3, column 133.
s\react-native-gesture-handler\android')
settings.gradle
rootProject.name = 'Contacts'
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '..\node_modules\react-native-gesture-handler\android')
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '..\node_modules\react-native-vector-icons\android')
include ':app'
What is actually wrong with this file?
Try forward slashes / instead of backslash \
use code
rootProject.name = 'Contacts'
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
include ':app'
instead of
rootProject.name = 'Contacts'
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '..\node_modules\react-native-gesture-handler\android')
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '..\node_modules\react-native-vector-icons\android')
include ':app'
Hope it will help