Open alexmngn opened 5 years ago
radiosilence
commented
5 years ago Ok, so we solved this by adding a .yarnclean file in our project route and doing a rimraf and yarn install:
./.yarncleanAntDesign.ttf Entypo.ttf EvilIcons.ttf Feather.ttf FontAwesome.ttf FontAwesome5_Brands.ttf FontAwesome5_Regular.ttf FontAwesome5_Solid.ttf Fontisto.ttf Foundation.ttf Ionicons.ttf MaterialCommunityIcons.ttf MaterialIcons.ttf Octicons.ttf SimpleLineIcons.ttf Zocial.ttf
Jpoliachik
commented
5 years ago Even if you disable autolinking for iOS via react-native.config.js in project:
module.exports = {
dependencies: {
"react-native-vector-icons": {
platforms: {
ios: null,
},
},
},
};It still adds everything inside node_modules/react-native-vector-icons/Fonts directory to the iOS Project.
I'm not sure if there's a way to override how react-native-vector-icons declares the Font assets - I can't find much info on the react-native.config.js schema.
In the meantime, I solved by adding a postinstall script to package.json.
This script removes the /Fonts directory from react-native-vector-icons completely. If you want a single font, modify the script to only remove the fonts you don't use.
package.json:
"scripts": {
"postinstall": "node ./scripts/postinstall.js"
}postinstall.js:
const fs = require("fs-extra");
const PROJECT_ROOT = ".";
// https://github.com/oblador/react-native-vector-icons/issues/1077
function reactNativeVectorIconsClean() {
const iconsDir = `${PROJECT_ROOT}/node_modules/react-native-vector-icons/Fonts`;
const exists = fs.existsSync(iconsDir);
if (exists) {
fs.removeSync(iconsDir);
}
}
reactNativeVectorIconsClean();
TomBerriot
commented
5 years ago Same issue on our project, it would be nice to customize the fonts loaded as it is done for android 👍
Damoness
commented
5 years ago I have the some problem. I import only one icon into my project , but all the fonts are added to my ipa
abdelmagied94
commented
4 years ago Also, if we run react-native link to link the custom fonts. All the fonts is added in the project bundle resources which cause multiple resources issue (The fonts exist two times one in the pods resource and the other in the bundle resources) 😞
thanhcuong1990
commented
4 years ago I've got the same issue. I just need to use my custom font.
My idea is try to delete the Fonts folder from react-native-vector-icons in pod pre_install hook. Hope this help!
Podfile
pre_install do |installer|
FileUtils.rm_rf('../node_modules/react-native-vector-icons/Fonts')
end
Monte9
commented
4 years ago I ran into this exact issue - we have a brownfield app and I only wanted to use 1 font MaterialCommunityIcons.ttf from rn-vector-icons. So I was trying to figure out how to only link that 1 font in the Copy pod resources step in Build Phases.
My idea is to try to delete the Fonts folder from react-native-vector-icons in pod pre_install hook. Hope this help!
@thanhcuong1990 that's the right approach but turns about pre_install isn't a thing anymore in Podfile. So here's what I came up with instead!
## React Native Vector Icons
## Deletes all the fonts except MaterialCommunityIcons.ttf
fonts_path = "node_modules/react-native-vector-icons/Fonts/"
fonts = Dir.glob(fonts_path + "*.ttf")
fonts.each do |font|
material_community_icons = fonts_path + "MaterialCommunityIcons.ttf"
if font != material_community_icons
# Delete unused font
FileUtils.rm font
end
end
puts "Deleted unused RNVectorIcons fonts"
# React Native Autolinking (for third-party dependencies)
# https://github.com/react-native-community/cli/blob/master/docs/autolinking.md
use_native_modules!This works like a charm! Hope it helps y'all.
abdelmagied94
commented
4 years ago I resolved this issue by disabling auto-linking for the package and add the fonts I need to the assets. This is done by modifying react-native.config.js to the following:
const VECTOR_ICONS_FONTS_PATH = "./node_modules/react-native-vector-icons/Fonts"
const VECTOR_FONTS = ["FontAwesome.ttf"]
module.exports = {
assets: ["./src/res/fonts/"],
dependencies: {
// Disable auto linking for `react-native-vector-icons` and link
// the required fonts manually to avoid duplicate resources issue in iOS.
"react-native-vector-icons": {
platforms: {
ios: null,
android: null,
},
assets: VECTOR_FONTS.map((font) => VECTOR_ICONS_FONTS_PATH + "/" + font),
},
},
}
yahveh
commented
4 years ago @SudoPlz no effect,any details?
yahveh
commented
4 years ago @SudoPlz unfortunately not work for me.
react-native init a new project for testing, failed.
react-native init test
cd test
yarn add react-native-vector-icons
cd ios
pod install
react-native run-iosopen the dir showed, all fonts added, dont't known what i missed.
This is my testing, can work.
change RNVectorIcons.podspec ===> s.resources = "Fonts/Custom.ttf".
but i like yours...
camel113
commented
3 years ago I created a react-native.config.js at the root of my project as @abdelmagied94 or @SudoPlz suggested.
After that I deleted my node_moduels folder, ran a npm install and a pod install... Did not work, all the fonts are still imported in my project.pbxproj
My react-native.config.js
const VECTOR_ICONS_FONTS_PATH = "./node_modules/react-native-vector-icons/Fonts";
const VECTOR_FONTS = ["MaterialCommunityIcons.ttf"];
module.exports = {
dependencies: {
// Disable auto linking for `react-native-vector-icons` and link
// the required fonts manually to avoid duplicate resources issue in iOS.
"react-native-vector-icons": {
assets: VECTOR_FONTS.map(font => VECTOR_ICONS_FONTS_PATH + "/" + font)
}
}
};
SudoPlz
commented
3 years ago My solution was wrong.. It mislead me to think it worked (because I had made other changes too), but it doesn't. @abdelmagied94 's solution doesn't work for me either, not sure why.
For the time being, all we can do is just create a patch file..
diff --git a/node_modules/react-native-vector-icons/RNVectorIcons.podspec b/node_modules/react-native-vector-icons/RNVectorIcons.podspec
index 4b716ee..10f539a 100644
--- a/node_modules/react-native-vector-icons/RNVectorIcons.podspec
+++ b/node_modules/react-native-vector-icons/RNVectorIcons.podspec
@@ -12,7 +12,7 @@ Pod::Spec.new do |s|
s.platforms = { :ios => "9.0", :tvos => "9.0" }
s.source = { :git => "https://github.com/oblador/react-native-vector-icons.git", :tag => "v#{s.version}" }
s.source_files = 'RNVectorIconsManager/**/*.{h,m}'
- s.resources = "Fonts/*.ttf"
+ s.resources = "Fonts/Ionicons.ttf"
s.preserve_paths = "**/*.js"
s.dependency 'React-Core'
Environment
React Native 0.60 iOS project
Description
Now that we migrated to React Native 0.60 and use the auto-linking, the library automatically adds a bunch of fonts I don't need in my iOS project as I use my own personal font with my own icons in it.
Is there a way to ignore all of this so it doesn't get added to my project?