react native icons builder — Transform web icons into…

Pitch

Description

Comments

About this project

Introducing react-native-icons-builder, a CLI tool that bridges the gap between React Icons and React Native. With this tool, you can seamlessly convert any React Icon into a React Native component, reducing your bundle size and keeping your app lightweight. Just install, run a simple command, and use the icons you love without the cumbersome overhead.

react-native-icons-builder is a powerful Command-Line Interface (CLI) tool that facilitates the seamless transformation of React Icons into React Native components. Unlike traditional methods, which may require extensive configuration, this innovative tool leverages SWC to effortlessly convert react-icons library icons for use in your React Native applications.

Why Use react-native-icons-builder?

Native Compatibility: React Icons, while popular for web applications, are not directly compatible with React Native. react-native-icons-builder bridges this gap, allowing developers to utilize these icons without the hassle of additional overhead.
Optimized Bundle Size: The Metro bundler in React Native struggles with effective Tree Shaking. By using this tool, you can include only the icons you need, significantly reducing your application’s bundle size.

Key Features:

Extensive Icon Support: Access all icons available in the React Icons library with ease.
Zero External Dependencies: Besides react-native-svg, react-native-icons-builder has no other dependencies, simplifying integration into your project.
Simplified Integration: This tool requires no native code modifications, making it incredibly straightforward to use.

How to Use

Easily generate icons with simple CLI commands:

Basic Installation:

> npm install react-native-svg # or use pnpm or yarn  
> npx react-native-icons-builder@latest add AiFillApple

Explore your desired icons at React Icons.

Multiple Prefix Handling:

> npm install react-native-svg react-native-icons-builder # or use pnpm or yarn  
> npx react-native-icons-builder@latest add Fa500Px  
> ◆  Pick a prefix.
> │  ● fa
> │  ○ fa6
> └

For shorthand usage, you can specify prefixes directly in your commands:

> npx react-native-icons-builder@latest add fa/Fa500Px  
> npx react-native-icons-builder@latest fa6/Fa500Px

Shorthand Command:

> npm install react-native-svg react-native-icons-builder # or use pnpm or yarn  
> npm run rn-icons add AiFillApple

Acknowledgments

This project builds upon the excellent work of the react-icons library. Check out their repository at react-icons.

In summary, if you're looking to integrate React Icons into your React Native application efficiently and effectively while minimizing bundle size, react-native-icons-builder is the ideal solution!