msvgc

Msvgc

Utils para gerar componentes do React a partir de arquivos SVG simples
(Compatível com react-nativo)

Instalar:

 # install package globally
npm install -g msvgc

Uso:

 # provide for utils
msvgc -f ./path/to/pic.svg -o ./svgComponents/

-A bandeira --camelCase cria componentes com nomes de classe de casos de camelo

--react-native SPAND cria componentes usando a biblioteca React-native-SVG

--color cria componentes nativos do React com adereços de cores passados para o suporte de preenchimento de crianças SVG

-O sinalizador --typescript usará as instruções de importação do TypeScript, por exemplo ( import * as React )

--coffeescript sinalizador usará a sintaxe do CoffeeScript CJSX para criar componentes

Notas:

Se os parâmetros padrão não estiverem definidos, o diretório de trabalho atual será usado como o caminho para arquivos .svg com saída no diretório ./svg.

Os subdiretos que contêm arquivos .SVG gerarão seus componentes de reação correspondentes dentro de um subdiretório no caminho de saída.

O caminho de saída contém um index.js que exporta todos os componentes gerados.

Reaja JS:

Use componentes gerados em seus arquivos JSX/TSX/CJSX:

 [ ... ]

import Pic from './svgComponents/Pic'

class MyComponent extends Component {
  render ( ) {
    return (
      < div >
        < Pic width = { 300 } height = { 100 } />
        < p > Lorem ipsum... </ p >
      </ div >
    ) ;
  }
}

[ ... ] 

PENDÊNCIA:

• Crie arquivo de índice no diretório de componentes de destino.
  • Forneça aviso quando os nomes de componentes duplicados existem no índice.
• Compare arquivos existentes no diretório de componentes de destino.