1.安装font-spider
安装好nodejs，然后执行：
npm install font-spider -g2.书写 CSS
注意html页面引用的css必须是相对路径 不能使用绝对路径 否则fontspider不能识别
/*声明 WebFont*/
@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';
}特别说明： @font-face 中的 src 定义的 .ttf 文件必须存在，其余的格式将由工具自动生成
页面依赖的字体将会自动压缩好，原 .ttf 字体会备份，后期添加新字体只需要替换这个备份字体再重新提取即可。
3.压缩字体 WebFont
font-spider dest/news.html dest/index.html dest/about.html4.安装gulp插件
npm install gulp-font-spider --save-dev使用
在项目根目录 gulpfile.js
'use strict';
var gulp = require('gulp');
var fontSpider = require('./');
gulp.task('font', function() {
return gulp
.src('test/*.html')
.pipe(gulp.dest('release'))
.pipe(fontSpider({
silent: false,
backup: false,
ignore: ['\\.woff2$']
}));
});
gulp.task('default', ['font']);var gulp = require( 'gulp' );
var fontSpider = require( 'gulp-font-spider' );
gulp.task('fontspider', function() {
return gulp.src('./index.html')
.pipe(fontSpider());
});
gulp.task('default', ['fontspider']);Gulp-watch监听文件的保存
var gulp = require( 'gulp' );
var fontSpider = require( 'gulp-font-spider' );
var watch = require( 'gulp-watch' );
gulp.task('font', function() {
return gulp.src('./dest/*.html')
.pipe(fontSpider());
});
gulp.task('auto',function(){
gulp.watch('./dest/1.html',['font'])
})
gulp.task('default', ['auto']);5.常见问题
输入运行gulp-v 或gulp相关的命令（例如gulp less、gulp build）报错
'gulp'不是内部或者外部命令，也不是可运行的程序或批处理文件
问题分析：
原因一：环境变量没有设置
原因二：没有安装全局的gulp，只安装了本地gulp,命令行无法执行gulp-v，也无法执行gulp其它的相关命令
解决方法：
解决方法一：设置环境变量
npm config get prefix这个地址就是那个系统变量PATH
解决方法二：全局安装gulp
npm install gulp -g两种方法配置完成之后，命令提示符都需关闭之后，再重新打开，才能起作用。
没有安装全局的gulp，只安装了本地gulp,命令行无法执行gulp-v，也无法执行gulp其它的相关命令。
默认运行的错误
1.在每个任务流的开始加一个return 关键字
2.命令行cmd命令提示符运行gulp出现提示错误
gulp Task 'default' is not in your gulpfile
是github文档写错了，defualt
应该是
default我们再次运行Gulp命令
参考文档：
如何在网页中解决设计师留给你的字体问题？
使用Gulp+fontspider按需压缩中文字体，自由引入webfont还原设计
前端构建工具gulp入门教程
gulp详细入门教程
浏览搜狐网页会自动跳到主页去，看着一篇文章突然没了，页面跳到搜狐主页去了。
搜狐无赖设定，一旦浏览完当前网页，即网页到底，6秒后会自动跳转至搜狐主页。不仅浪费手机流量和宝贵时间，招人痛恨之余，还刷新了比标题党更无耻更卑鄙更下流的底线.............🥳
使用独立的node windows二进制文件
在http://node-js.prcn.co.cc/ 下载最新的“complete”包，解压到任意文件夹，阅读说明文档（doc/index.html）。在没有Cygwin的情况下安装需要Cygwin dll以及Cygwin gcc/g++运行时包。所有的其他东西都是静态链接到里面（这些事默认的编译参数，我们修改任何东西）。HTTPS和其他的cryptographicAPIs再0.2.0版本后都给予了支持。
Complete
这个包对于大部分用户开展实验来说足够了。包含node.exe、依赖dll和文档，但是它不是真正的“完全”，你不能通过c++进行Node模块扩展，因为需要完全的Cygwin 安装。
Node.exe only
设计Node.exe only包的想法是Node更新比Cygwin更为频繁，这样，当有新版本更新时，只需要下载一个新的exe即可，相关的依赖内容是一样的。如果你已经安装了相关的依赖DLLS，在本示例中只需要拷贝node.exe到/usr/bin（这是“make install”放置的地方）。注意，从0.1.104版本后文档也包含在包中。
Dependencies only
当你下载了上面的“exe only”包，但却不能工作，同时你也不想自己搞定的情况下使用。
LTS = Long Term Support