在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称(OpenSource Name):aui/gulp-font-spider开源软件地址(OpenSource Url):https://github.com/aui/gulp-font-spider开源编程语言(OpenSource Language):JavaScript 100.0%开源软件介绍(OpenSource Introduction):字蛛 - gulp 插件字蛛是一个中文 WebFont 自动化压缩工具,它能自动分析页面使用的 WebFont 并进行按需压缩,无需手工配置。 特性
安装npm install gulp-font-spider --save-dev 使用var gulp = require( 'gulp' );
var fontSpider = require( 'gulp-font-spider' );
gulp.task('fontspider', function() {
return gulp.src('./index.html')
.pipe(fontSpider());
});
gulp.task('defualt', ['fontspider']); 推荐的跨浏览器 /*声明 WebFont*/
@font-face {
font-family: 'pinghei';
src: url('../font/pinghei.eot');
src:
url('../font/pinghei.eot?#font-spider') format('embedded-opentype'),
url('../font/pinghei.woff') format('woff'),
url('../font/pinghei.ttf') format('truetype'),
url('../font/pinghei.svg') format('svg');
font-weight: normal;
font-style: normal;
}
/*使用选择器指定字体*/
.home h1, .demo > .test {
font-family: 'pinghei';
}
APIfontSpider(options)options{
/**
* 忽略加载的文件规则(支持正则) - 与 `resourceIgnore` 参数互斥
* @type {Array<String>}
*/
ignore: [],
/**
* 映射的文件规则(支持正则) - 与 `resourceMap` 参数互斥 - 可以将远程字体文件映射到本地来
* @type {Array<Array<String>>}
* @example [['http://font-spider.org/font', __diranme + '/font'], ...]
*/
map: [],
/**
* 是否支持备份原字体
* @type {Boolean}
*/
backup: true,
/**
* 是否对查询到的文本进行去重处理
* @type {Boolean}
*/
unique: true,
/**
* 是否排序查找到的文本
* @type {Boolean}
*/
sort: true,
/**
* 是否支持加载外部 CSS 文件
*/
loadCssFile: true,
/**
* 是否忽略内部解析错误-关闭它有利于开发调试
* @type {Boolean}
*/
silent: true,
/**
* 请求超时限制
* @type {Number} 毫秒
*/
resourceTimeout: 8000,
/**
* 最大的文件加载数量限制
* @type {Number} 数量
*/
resourceMaxNumber: 64,
/**
* 是否缓存请求成功的资源
* @type {Boolean}
*/
resourceCache: true,
/**
* 映射资源路径 - 与 `map` 参数互斥
* @param {String} 旧文件地址
* @return {String} 新文件地址
*/
resourceMap: function(file) {},
/**
* 忽略资源 - 与 `ignore` 参数互斥
* @param {String} 文件地址
* @return {Boolean} 如果返回 `true` 则忽略当当前文件的加载
*/
resourceIgnore: function(file) {},
/**
* 资源加载前的事件
* @param {String} 文件地址
*/
resourceBeforeLoad: function(file) {},
/**
* 加载远程资源的自定义请求头
* @param {String} 文件地址
* @return {Object}
*/
resourceRequestHeaders: function(file) {
return {
'accept-encoding': 'gzip,deflate'
};
}
} 使用场景限制
字体兼容性参考
来源:http://caniuse.com/#feat=fontface 贡献者相关链接============= 字体受版权保护,若在网页中使用商业字体,请联系相关字体厂商购买授权 |
2023-10-27
2022-08-15
2022-08-17
2022-09-23
2022-08-13
请发表评论