Download react fontawesome - react fontawesome

react fontawesome

Baixar fonte

General cleanup and documentation fixes

Baixar

React-in-the -ome

Um componente React para a biblioteca de ícones de fontes.

Se você estiver usando a Font Awesome V5+, use o componente oficial do React!. react-fontawesome não suporta o Fontawesome V5!

Este projeto não é mais mantido ativamente. Por favor, tente usar o componente oficial acima se você puder!

Instalar

npm install --save react-fontawesome

Nota: Este componente não inclui nenhum dos CSs ou fontes impressionantes da fonte, portanto, você precisará incluir aqueles de alguma forma, adicionando -os ao seu processo de construção ou vinculando às versões da CDN.

Usando a versão CDN

A maneira mais rápida de começar é importar o Fontawesome com uma tag de link na sua página <head> :

 < link href =" https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css " rel =" stylesheet " />

Você pode alterar o número da versão para usar qualquer versão do Fontawesome que desejar.

Usando com webpack

Se você estiver usando o WebPack, precisará instalar o Fontawesome, importar o SASS/LESSTENHATION e configurar o caminho da fonte. Consulte esta postagem no blog sobre como obter o WebPack e o Fontawesome trabalhando juntos.

Uso

 var React = require ( 'react' )
var FA = require ( 'react-fontawesome' )

React . render ( < FA name = "rocket" /> , document . body )

Características

Sem dependências (exceto o React)
API simples que reflete os nomes das classes da Font Awesome.
Suporta todos os modificadores impressionantes da fonte (veja a API abaixo).
Faça uso de módulos CSS
Adicione seu próprio className S, estilos e outros adereços (todos os adereços adicionais são passados diretamente para o componente).

Exemplos

Uso regular

 var React = require ( 'react' )
var FontAwesome = require ( 'react-fontawesome' )

var MyComponent = React . createClass ( {
  render : function ( ) {
    return (
      < FontAwesome
        className = "super-crazy-colors"
        name = "rocket"
        size = "2x"
        spin
        style = { { textShadow : '0 1px 0 rgba(0, 0, 0, 0.1)' } }
      />
    )
  } ,
} )

Com o uso de módulos CSS

 import React from 'react'
import FontAwesome from 'react-fontawesome'
import faStyles from 'font-awesome/css/font-awesome.css'

var MyComponent = React . createClass ( {
  render : function ( ) {
    return (
      < FontAwesome
        className = "super-crazy-colors"
        name = "rocket"
        cssModule = { faStyles }
        size = "2x"
        spin
        style = { { textShadow : '0 1px 0 rgba(0, 0, 0, 0.1)' } }
      />
    )
  } ,
} )

O acima criará saída como esta:

 <span class="font-awesome__fa___2otTb font-awesome__fa-rocket___lfSov font-awesome__super-crazy-colors___3k583"></span>

API

Veja os documentos da API para obter documentação completa.

Contribuindo

Pull Pedidos bem -vindos!

Execute o conjunto de testes com npm test e formate seu código com npm run format . Certifique -se de que os testes estejam passando e que você escreva testes para novos recursos e alterações de documentos na API com atualizações para os JSDOCs.

Antes de enviar sua solicitação de tração, execute npm run dist para construir o projeto e confirmar as alterações.