React-native-vector-icons: when I customize font on IOS,something is wrong with " 'Unrecognized font family 'Icomoon' "

[qingwenje2008]

My step:

### 1, stick the Icomoon.ttf file to the “ node_modules/react-native-vector-icons/Fonts” directory

2, create Icomoon.js under ”node_modules/react-native-vector-icons“, the contents are as follows:

Import createIconSet from'./lib/create-icon-set';
Import glyphMap from'./glyphmaps/Icomoon.json';

Const iconSet = createIconSet (glyphMap,'Icomoon','Icomoon.ttf');

Export default iconSet;
Export const Button = iconSet.Button;
Export const TabBarItem = iconSet.TabBarItem;
Export const TabBarItemIOS = iconSet.TabBarItemIOS;
Export const ToolbarAndroid = iconSet.ToolbarAndroid;
Export const getImageSource = iconSet.getImageSource;

3.The contents of the new Icomoon.json under the “ node_modules/react-native-vector-icons/glyphmaps” directory are as follows:

{
  "details_button_record_normal":59648,
  "details_icon_collect_normal":59649,
  "details_icon_invite_normal":59650,
  "details_icon_write_normal":59651,
  "nav_icon_find_highlight":59652,
  "nav_icon_find_normal":59653,
  "nav_icon_me_highlight":59654,
  "nav_icon_me_normal":59655,
  "nav_icon_mymarket_highlight":59656,
  "nav_icon_mymarket_normal":59657,
  "public_icon_Collect_highlight":59658,
  "public_icon_Collect_normal":59659,
  "public_icon_fabulous_normal":59660,
  "public_icon_news":59661,
  "public_icon_search_normal":59666,
  "public_icon_share_normal":59667,
  "public_icon_stick_highlight":59668,
  "public_icon_stick_normal":59669
  }

4, in the XCode project root, pull “node_modules/react-native-vector-icons/Fonts” in, and then execute ‘react-native link’

I want to know why it was wrong and how I should debug it. Do anyone know, help me!

[oblador]

Hi, please read the README section on manual integration which is what you need for your custom font!

[lnsergioantonio]

@oblador for 15 days looking for the solution to the problem and always sent the manual and everything said, and recompiled and created a new project, and I could not solve that problem, until I solved the problem I read that the cache should be removed with the following command

rm -rf ios/build/ModuleCache/*

it is worthwhile that in the manual that line of code is put as a recommendation

I hope I help you @qingwenje2008
Greetings, and excuse my English :)

[oieduardorabelo]

definitely something to add around Option: With rnpm in the docs,

I did what @evilexus suggested and rebundled my app, worked like a charm,

my steps:

1. react-native init Test && cd Test
2. yarn add react-native-vector-icons
3. react-native link react-native-vector-icons
4. rm -rf ios/build/ModuleCache/*
5. react-native run-ios

[oblador]

@evilexus Good idea, I added it to the troubleshooting section. I'd happily accept a PR with further improvements though 👍

[qingwenje2008]

I have sovled this problem ，It's because I didn't configure it well，I haven't seen my github for a long time , and I've forgotten which one is configured to sovle it . but thank you all the same

[callmejm]

hi, how you get the number of glyphmaps json ? like 59648