msvgc

MSVGC

Util untuk menghasilkan komponen bereaksi dari file SVG biasa
(kompatibel dengan reaksi-asli)

Memasang:

 # install package globally
npm install -g msvgc

Penggunaan:

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

-Bendera --camelCase Membuat Komponen dengan Nama Kelas Kasus Unta

-Bendera --react-native membuat komponen menggunakan perpustakaan reaksi-asli-SVG

-Bendera --color menciptakan komponen reaksi-asli dengan alat peraga warna yang diteruskan ke SVG Children's Fill Prop

--typescript Flag akan menggunakan pernyataan impor naskah misalnya ( import * as React )

--coffeescript Flag akan menggunakan sintaks Cofescript CJSX untuk membuat komponen

Catatan:

Jika Param Default tidak diatur, direktori kerja saat ini akan digunakan sebagai jalur ke file .svg dengan output di direktori ./svg.

Subdirektori yang mengandung file .svg akan menghasilkan komponen reaksi yang sesuai dalam subdirektori di jalur output.

Jalur output berisi index.js yang mengekspor semua komponen yang dihasilkan.

Bereaksi JS:

Gunakan komponen yang dihasilkan dalam file JSX/TSX/CJSX Anda:

 [ ... ]

import Pic from './svgComponents/Pic'

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

[ ... ] 

TODO:

• Buat file indeks di direktori komponen target.
  • Berikan peringatan saat nama komponen duplikat ada dalam indeks.
• Bandingkan file yang ada di direktori komponen target.