svgs2fonts

svgs2fonts

svg 圖標轉字體圖標庫（svgs -> svg,ttf,eot,woff,woff2）。 English readme

版本

2.0.3

安裝

1.全局安裝(腳手架工具)

npm i -g svgs2fonts

驗證

svgs2fonts -v

2.模塊依賴安裝

npm i --save svgs2fonts

使用

方式1——模塊引入（支持TypeScript）

 import Svgs2fonts from 'svgs2fonts' ;
// or
// const Svgs2fonts = require('svgs2fonts');

Svgs2fonts . init ( options ) ;

其中options 參數：

字段	類型	預設值	描述
src	string	-	svg 圖標文件的目錄路徑
dist	string	./dist	字體圖標輸出路徑
fontName	string	iconfont	輸出圖標/字體名稱
unicodeStart	number	10000	unicode 起始數字（設置此指是需要避開正常unicode 範圍），（ v2.0之前對應字段為startNumber ）
noDemo	boolean	true	是否需要輸出html Demo 文件
demoUnicodeHTML	string	demo_unicode.html	unicode 類型的示例html 名稱
demoFontClassHTML	string	demo_fontclass.html	fontClass 類型的示例html 名稱

*V2 廢棄字段：

• debug ( v2.1.0废弃)： ${Boolean} ，是否開啟debug 模式以輸出更多執行信息，默認false
• timeout （ v2.0废弃）： {Number} ，執行超時時間，默認為60s（ 60000 ）
• logger （ v2.0废弃）： {Object} ，日誌記錄。

demo

 import Svgs2fonts from 'svgs2fonts' ;
import { join } from 'path' ;

Svgs2fonts . init ( {
  src : __dirname , // svg path
  dist : join ( __dirname , 'dest' ) , // output path
  fontName : 'myIconfont' , // font name
  noDemo : true , // no demo html files
} )
  . then ( ( ) => console . log ( 'task success!' ) )
  . catch ( err => console . log ( `task failed( ${ err } )` ) ) ;

方式2——控制台

svgs2fonts {srcpath} {distpath} {options}

其中參數：

• srcpath: svg 源文件路徑（相對當前窗口環境），傳""時為當前窗口路徑;
• distpath: 導出路徑，默認在源文件路徑下;
• options: 配置參數，見下文

example

svgs2fonts svg dist

options 配置參數

-n / --name

圖標庫的名字(default: "iconfont" ).

example

svgs2fonts svg dist -n myiconfont

--number

unicode 起始編碼(default: 10000 ).

example

 svgs2fonts svg dist --number 50000

--nodemo

不要demo html(default: false ).

example

 svgs2fonts svg dist --nodemo

example

 svgs2fonts svg dist

Project build

安裝依賴：

 npm i

構建：

 npm run build

單測：

 npm run test

demo 測試：

 npm run test:example

Author

Micheal Wayne

引導文章-《svg、ttf、woff、woff2 圖標的研究及轉換（svgs2fonts）》

Build time

2018.08.26

Last modified

• 2024.09.28: v2.1.0 change log and remove debug;
• 2023.12.16: v2.0.3 add some defensive handing;
• 2023.06.03: v2.0.2 optimal variable control;
• 2022.11.03: v2.0.1 split css & support svg size options;
• 2022.10.07: code bug fixed;
• 2022.03.20: v2 support for ts;
• 2021.12.16: fix IE8 bug;