font-spider
(./README-ZH-CN.md), (./README.md), (./README-JA.md)
Font-spider is a compress tool for WebFont which can analyze your web-page intelligently to find the fonts out which have been used and then compress them.
字蛛是一个智能 WebFont 压缩工具，它能自动分析出页面使用的 WebFont 并进行按需压缩。
フォント・スパイダー（font-spider）は、Webフォントを圧縮するためのスマートなツールです，Webページに使用されるWebフォントを分析し、必要に応じて圧縮することができます。
Feature
- Font subsetter: Our tool is based on HTML and CSS analysis and completely running in local so that.
- Font converter: Support woff2, woff, eot, svg font format generation.
Install
npm install font-spider -g
Use
step one: code CSS
@font-face {
font-family: 'source';
src: url('../font/source.eot');
src:
url('../font/source.eot?#font-spider') format('embedded-opentype'),
url('../font/source.woff2') format('woff2'),
url('../font/source.woff') format('woff'),
url('../font/source.ttf') format('truetype'),
url('../font/source.svg') format('svg');
font-weight: normal;
font-style: normal;
}
.home h1, .demo > .test {
font-family: 'source';
}
Attention: the ".ttf" file must be existed which is referred in
srcproperty of@font-face, and our font-spider will automatically generate other formats of font.
step two: compress WebFont by using font-spider
font-spider [options] <htmlFile1 htmlFile2 ...>
htmlFiles
One or more web-page addresses which support the http form.
Example:
font-spider dest/news.html dest/index.html dest/about.html
options
Usage: font-spider [options] <htmlFile ...>
Options:
-h, --help output usage information
-V, --version output the version number
--info show only webfont information
--ignore <pattern> ignore the files
--map <remotePath,localPath> mapping the remote path to the local
--no-backup do not back up fonts
--debug enable debug mode
sample of parameters usage
Use the wildcard character to compress the WebFont of several HTML file:
font-spider dest/*.html
--info Show the WebFont that has been used on the website:
font-spider --info http://fontawesome.io
--ignore Ignore the file:
font-spider --ignore "icon\\.css$" dest/*.html
--map This parameter will map the WebFont of online page to local and then compress it (the local path must be an absolute path):
font-spider --map "http://font-spider.org/font,/Website/font" http://font-spider.org/index.html
Build plugins
API
See:API.md
Limitations
- Only the constant texts and styles are supported, but not the dynamic elements and styles which is inserted by javascript.
- The ".otf" format fonts should be transfered to ".ttf" format firstly, so that we can start our compressing work.
- Only the HTML and CSS files which is encoded by
utf-8are supported.