SVG berguna untuk resolusi yang tidak tergantung pada perangkat, tetapi seringkali bisa menjadi rasa sakit karena font harus tertanam dalam file untuk diterjemahkan dengan benar di semua browser. svg-embed-font adalah alat baris perintah untuk dengan mudah menentukan font apa yang digunakan dalam file SVG dan menyandikannya sebagai aset base64 di dalamnya.
Jika aset SVG Anda terlihat bagus di komputer Anda dan mengacaukan orang lain, itu karena font tidak tertanam dengan benar dalam file.
svg-embed-font input.svg
Dalam mode default, alat ini akan memindai file SVG untuk semua deklarasi font-family kemudian mencoba menemukan file font yang cocok (format file font apa pun). Pertandingan didefinisikan sebagai kecocokan substring yang tidak sensitif untuk nama keluarga font mengabaikan ruang apa pun. Jadi jika Anda menyatakan:
font-family: 'Permanent Marker'
Matches:
permanentmarker.ttf
PermanentMarker-700.otf
Dalam hal ini, ada dua kecocokan yang mungkin, yang sering dapat terjadi ketika font datang dalam banyak bobot. Untuk menentukan mana yang harus digunakan, daftarkan font pada baris perintah setelah file input. Beberapa kecocokan yang mungkin harus diselesaikan dengan mendaftarkan yang benar pada baris perintah.
svg-embed-font input.svg permanentmarker.ttf
Satu atau lebih file font yang disukai dapat dicantumkan pada baris perintah dan itu akan menggunakan file -file tersebut alih -alih kecocokan lain yang ditemukannya.
Jika Anda tidak menentukan file font yang tepat, itu akan terlihat di direktori saat ini dan semua subdirektori untuk kecocokan, sehingga Anda dapat meletakkan file Anda dalam hierarki logis dan itu akan menemukannya. Jika menghabiskan semua file yang mungkin tanpa menemukan kecocokan dengan setiap font dalam file SVG, itu akan mengembalikan kesalahan.
File font adalah base64 yang dikodekan dan dimasukkan sebagai aset stylesheet langsung dalam file SVG. Jika Anda membuka file di editor teks, tepat sebelum tag penutupan </defs> Anda akan melihat sesuatu seperti berikut untuk setiap font:
<style type="text/css">
<![CDATA[
@font-face {
font-family: 'Permanent Marker';
src: url('data:application/x-font-ttf;base64,AAEAAAAOAIAAAwBgT1MvMmH1Ke...<lots more>');
}
]]>
</style>
Unduh rilis yang sesuai untuk sistem operasi Anda di halaman rilis.
Mit