webfont
11.2.20 (2021-07-31)
Generator font dari ikon SVG.
WOFF2 , WOFF , EOT , TTF dan SVG ;JavaScript , JSON atau YAML untuk menentukan informasi konfigurasi untuk seluruh direktori dan semua subdirektori;css , scss , styl dll);gulp , grunt atau alat besar lainnya;linux , windows dan osx );npm install --save-dev webfont import webfont from "webfont" ;
webfont ( {
files : "src/svg-icons/**/*.svg" ,
fontName : "my-font-name" ,
} )
. then ( ( result ) => {
// Do something with result
Function . prototype ( result ) ;
// Or return it
return result ;
} )
. catch ( ( error ) => {
throw error ;
} ) ;atau
const webfont = require ( "webfont" ) . default ;
webfont ( {
files : "src/svg-icons/**/*.svg" ,
fontName : "my-font-name" ,
} )
. then ( ( result ) => {
// Do something with result
Function . prototype ( result ) ;
// Or return it
return result ;
} )
. catch ( ( error ) => {
throw error ;
} ) ;filesstring | arraynode_modules dan bower_components selalu diabaikan. configFilestring(JSON, YAML, or CommonJS) atau nama modul di node_modules yang menunjuk ke satu.configFile , WebFont akan mencari file direktori untuk file konfigurasi di tempat -tempat berikut, dalam urutan ini:webfont di package.json.webfontrc (dengan atau tanpa ekstensi nama file: .json , .yaml , dan .js tersedia)webfont.config.js yang mengekspor object JS. Pencarian akan dimulai di direktori kerja dan naikkan pohon direktori sampai menemukan file konfigurasi. fontNamestringwebfontformatsarray ,['svg', 'ttf', 'eot', 'woff', 'woff2'] ,svg, ttf, eot, woff, woff2 ,template Ketik: string
Default: null
Nilai yang mungkin: css , scss , styl (jangan ragu untuk berkontribusi lebih banyak).
CATATAN: Jika Anda ingin menggunakan templat khusus, gunakan opsi ini, lulus di string path seperti ini:
webfont ( {
template : "./path/to/my-template.css" ,
} ) ;Atau
webfont ( {
template : path . resolve ( __dirname , "./my-template.css" ) ,
} ) ;Atau
webfont ( {
template : path . resolve ( __dirname , "./my-template.styl" ) ,
} ) ; templateClassNamestringnulltemplateFontPathstring./CSS . templateFontNamestringfontName jika tidak diatur, tetapi Anda dapat menentukan nilai apa pun.ligaturesbooleantrueglyphTransformFn Jenis: function
Default: null
Deskripsi: Jika Anda ingin mengubah glyph metadata (misalnya judul kelas CSS atau unicode) sebelum mentransfernya di template gaya Anda untuk ikon Anda, Anda dapat menggunakan opsi ini dengan objek Glyph Metadata.
Contoh:
import webfont from "webfont" ;
webfont ( {
files : "src/svg-icons/**/*.svg" ,
glyphTransformFn : ( obj ) => {
obj . name += "_transform" ;
something ( ) ;
return obj ;
} ,
} )
. then ( ( result ) => {
// Do something with result
Function . prototype ( result ) ;
// Or return it
return result ;
} )
. catch ( ( error ) => {
throw error ;
} ) ; sortbooltrueIni dapat ditambahkan ke opsi webfont. Ini diteruskan langsung ke SVGICONS2SVGFONT.
svgicons2svgfont.fontNamestringsvgicons2svgfont.fontIdstringfontNamesvgicons2svgfont.fontStylestring''svgicons2svgfont.fontWeightstring''svgicons2svgfont.fixedWidthbooleanfalsesvgicons2svgfont.centerHorizontallybooleanfalsesvgicons2svgfont.normalizebooleanfalsesvgicons2svgfont.fontHeightnumberMAX(icons.height)svgicons2svgfont.roundnumber10e12 Mengatur SVG Path Rounding. svgicons2svgfont.descentnumber0svgicons2svgfont.ascentnumberfontHeight - descentsvgicons2svgfont.metadatastringundefinedsvgicons2svgfont.logfunctionconsole.logfunction(){} untuk menonaktifkan logging. Antarmuka untuk penggunaan baris perintah cukup sederhana pada tahap ini, seperti yang terlihat di bagian penggunaan berikut.
Tambahkan skrip cli ke objek scripts file package.json Anda:
{
"scripts" : {
"webfont" : " node node_modules/webfont/dist/cli.js "
}
}Jika Anda menggunakan Cross-Env:
{
"scripts" : {
"webfont" : " cross-env node_modules/webfont/dist/cli.js "
}
} Usage: webfont [input] [options]
Input: File(s) or glob(s).
If an input argument is wrapped in quotation marks, it will be passed to " fast-glob "
for cross-platform glob support.
Options:
--config
Path to a specific configuration file (JSON, YAML, or CommonJS)
or the name of a module in ` node_modules ` that points to one.
If no ` --config ` argument is provided, webfont will search for
configuration files in the following places, in this order:
- a ` webfont ` property in ` package.json `
- a ` .webfontrc ` file (with or without filename extension:
` .json ` , ` .yaml ` , and ` .js ` are available)
- a ` webfont.config.js ` file exporting a JS object
The search will begin in the working directory and move up the
directory tree until a configuration file is found.
-f, --font-name
The font family name you want, default: " webfont " .
-h, --help
Output usage information.
-v, --version
Output the version number.
-r, --formats
Only this formats generate.
-d, --dest
Destination for generated fonts.
-m, --dest-create
Create destination directory if it does not exist.
-t, --template
Type of template ( ` css ` , ` scss ` , ` styl ` ) or path to custom template.
'
-s, --dest-template
Destination for generated template. If not passed used `dest` argument value.
-c, --template-class-name
Class name in css template.
-p, --template-font-path
Font path in css template.
-n, --template-font-name
Font name in css template.
--no-sort
Keeps the files in the same order of entry
--verbose
Tell me everything!.
For "svgicons2svgfont":
--font-id
The font id you want, default as "--font-name".
--font-style
The font style you want.
--font-weight
The font weight you want.
--fixed-width
Creates a monospace font of the width of the largest input icon.
--center-horizontally
Calculate the bounds of a glyph and center it horizontally.
--normalize
Normalize icons by scaling them to the height of the highest icon.
--font-height
The outputted font height [MAX(icons.height)].
--round
Setup the SVG path rounding [10e12].
--descent
The font descent [0].
--ascent
The font ascent [height - descent].
--start-unicode
The start unicode codepoint for files without prefix [0xEA01].
--prepend-unicode
Prefix files with their automatically allocated unicode codepoint.
--metadata
Content of the metadata tag.
--add-hash-in-font-url
Generated font url will be : [webfont].[ext]?v=[hash]
CLI dapat keluar dari proses dengan kode keluar berikut:
webpack .ttf2woff2 dengan Perpustakaan JS asli);Jangan ragu untuk mendorong kode Anda jika Anda setuju dengan penerbitan di bawah lisensi MIT.
Periksa changelog kami
Periksa lisensi kami
