手上有一套程序,自带iconfont字体库,想在这个字体库的基础上增加图标,不用搞两个这么麻烦。
两个字体库要考虑冲突等问题。
本想修改FontEditor代码(https://github.com/ecomfe/fonteditor)自动分割字体库导出每个字体的svg文件,
结果git代码下来没安装成功:
npm WARN enoent SKIPPING OPTIONAL DEPENDENCY: ENOENT: no such file or directory, rename 'E:\WebSite
PHP\www\iconfont\fonteditor-master\node_modules\fsevents\node_modules\inherits' -> 'E:\WebSite\PHP\w
ww\iconfont\fonteditor-master\node_modules\fsevents\node_modules.inherits.DELETE'
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: ini@1.3.5 (node_modules\fsevents\node_modules\ini):
npm WARN enoent SKIPPING OPTIONAL DEPENDENCY: ENOENT: no such file or directory, rename 'E:\WebSite
PHP\www\iconfont\fonteditor-master\node_modules\fsevents\node_modules\ini' -> 'E:\WebSite\PHP\www\ic
onfont\fonteditor-master\node_modules\fsevents\node_modules.ini.DELETE'...
...
ERROR in ./src/fonteditor/template/export/icon-css.tpl 5:0
Module parse failed: Unexpected character '@' (5:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to
process this file. See https://webpack.js.org/concepts#loaders
| */
|
@font-face {
| font-family: "{%=fontFamily%}";
| src: url("{%=fontFamily%}.eot"); /* IE9 */
@ ./src/fonteditor/template/export-render.js 43:55-87
@ ./src/fonteditor/widget/exporter.js
@ ./src/fonteditor/index.js
...
ERROR in Template execution failed: ReferenceError: lang is not defined
ERROR in ReferenceError: lang is not defined
index.tpl:100
E:/WebSite/PHP/www/iconfont/fonteditor-master/index.tpl10010
赶时间只好写js脚本自动导出了
先在http://fontstore.baidu.com/store#创建项目
起始代码点空,想加入项目成员的,怎么搜都搜不到
然后上传*.ttf文件,编辑字体,会跳到http://fontstore.baidu.com/static/editor/index.html?project=bdfont-1000***
我使用的是谷歌浏览器,配置一下下载不提示:
F12调出开发者工具,console下丢入代码:
var stop=0;
var time=500;
$("#glyf-list .glyf-item").each(function(e,i){
if(stop==0){
setTimeout('console.log("Start",'+e+')',time);
setTimeout('$("#glyf-list .glyf-item:nth-child('+e+')").click();console.log("选中",'+e+');',time);
time=time+500;
setTimeout('$("#glyf-list-commandmenu > li:nth-child(11)").click();console.log("点击导出",'+e+')',time);
time=time+500;
setTimeout('$("#glyf-download-svg").click();console.log("点击下载SVG",'+e+')',time);
time=time+1000;
setTimeout('$("#model-dialog > div > div > div.modal-header > button > span:nth-child(1)").click();console.log("关闭弹框",'+e+')',time);
setTimeout('console.log("End",'+e+')',time);
time=time+500;
}
});
撒泡尿的功夫完成了单个字体的svg导出了。
然后批量选择一起上传到iconfont。cn
再对照原来的字体库,修复一下class名字
现在可以愉快的增加图片然后下载覆盖了。