Loading...
Com Rocketicons, você procura entre milhares de ícones open source e adiciona apenas os componentes que seu projeto usa. A CLI grava esses arquivos no seu código: sua aplicação não importa uma coleção inteira nem depende de tree-shaking para fazer os ícones não usados sumirem.
A CLI atual espera um projeto TypeScript existente, em React ou React Native, com um arquivo tsconfig.json. Execute os comandos na raiz desse projeto.
A inicialização cria:
Ela também adiciona o alias @/ri/* ao tsconfig.json e instala @rocketicons/utils e @rocketicons/tailwind pelo npm. Essas são pequenas dependências compartilhadas usadas pelos componentes gerados e pela integração com Tailwind.
A instalação deixa o plugin disponível, mas seu projeto ainda precisa registrá-lo. Adicione @rocketicons/tailwind ao array plugins em tailwind.config.*:
Em arquivos de configuração CommonJS, use const rocketicons = require("@rocketicons/tailwind") e adicione o mesmo valor em plugins.
Use o explorador de ícones para escolher uma coleção e o ID exato. Por exemplo, o foguete do próprio Rocketicons é @rc/rc-rocket-icon.
A CLI grava src/ri/icons/rc-rocket-icon.tsx. Importe o componente do seu próprio código:
Esse é o plano de voo completo: encontre, adicione e importe. Continue em Adicionando Ícones para ver instalações repetidas e verificação, ou abra os guias rápidos por framework.
Hoje a CLI gera TSX no diretório fixo
src/ri, adiciona um ícone por comando e usa npm durante a inicialização. Saída JavaScript e caminhos configuráveis ficam para uma futura evolução da CLI.
Versão do catálogo: 0.3.1 · Conteúdo atualizado: 2026-08-12