New Major Version Coming (Testers wanted)

[johnf]

Hi All,

We have been working on a major refactor of React Native Vector Icons to move
it to a monorepo structure with individual packages for each font.

The major changes are

• Simple setup - only npm install needed
• Package per font - Only install the fonts you need for smaller bundle sizes
• Typescript support
• All fonts updated
• Font package generator - easily ship new fonts
• codemod for easy migration

We've released an alpha version and would love feedback on any issues before we go GA.

Check out the migration guide in MIGRATION.md

Help Needed! Can someone help make installation for OSX and Windows projects fully automated as well?

More details on all of the changes are below.

Simple setup

Significant effort has gone into automating the entire setup experience. For
a new user adding a font should be as simple as follows:

npm install @react-native-vector-icons/common @react-native-vector-icons/fontisto
cd ios && pod update
npm android
npm ios

import Fontisto from '@react-native-vector-icons/fontisto'

const App = () => <Fontisto name="comments" />

Package per font

Each font has its own npm package, which means you only get the fonts you want in your final build. For example, @react-native-vector-icons/evil-icons. The version numbers for the individual packages will track the upstream versions. This should provide more stability for your projects regarding knowing which glyphs will be supported in the font.

Significant improvements should be made in bundle sizes. For example, if you only need the evil icons font, instead of including 2.8MB of fonts, you would only include 14kB.

New npm scope

The npm modules are now hosted under @react-native-vector-icons.

Native typescript support and auto-completion

All packages are now written in typescript and export types.

LSP-based autocompletion should now be significantly improved, with the completion of icon names, including support for multi-style icons like FontAwesome 5 and 6.

Font updates

All fonts have been updated to the very latest versions. In the future, we intend to have automation via GitHub actions to track upstream fonts and release new versions automatically.

Font template generator

We have created a Yeoman generator, @react-native-vector-icons/generator-react-native-vector-icons, that you can use to create packages for your fonts. We use this to generate all the internal font packages. See the documentation for more details. We will also welcome pull requests for new fonts. In the future, we'll write some GitHub actions to auto-update and publish based on upstream changes.

Other changes

Backwards computability with react-vector-icons has been removed.

Icon.Button has been removed.

The following methods have been removed

• getFontFamily
• getRawGlyphMap
• hasIcon
• getStyledIconSet

Fontawesome 5 & 6 now take an iconStyle prop to switch between icon styles like solid, sharp, etc.

Migration

A migration guide can be found in MIGRATION.md. We have created a codemod to
help with the heavy lifting, and documented all the steps.

[wbxl2000]

I would like to ask, is there a plan to update the website?

The current website has some shortcomings, such as slow loading and low search efficiency(#1215 #1025 ).

Maybe we can find some people to improve it together. 💪

[johnf]

I've seen those issues, and once we complete this release, I plan to review the website.

I would be more than happy to take PRs from anyone willing to help. Maybe kick off a discussion in a new issue if you're interested with your thoughts?