gulp-iconfont 任务未填充 unicode 值

Question

我正在从 grunt 转到 gulp，并且在使用 gulp-iconfont 库来创建我的图标字体和样式表时遇到问题。

依赖关系：

"devDependencies": {
  "gulp": "^3.9.0",
  "gulp-iconfont": "^5.0.1"
}

Gulpfile：

我有以下 gulfile 设置来构建字体：

var gulp     = require('gulp'),
    iconfont = require('gulp-iconfont');

var paths = {
    fonts:   'site/fonts/',
    icons:   'site/fonts/icons/src/',
    styles:  'site/styles/',
    scripts: 'site/scripts/'
};

gulp.task('icons', function(){
    return gulp.src([paths.icons + '*.svg'])
    .pipe(iconfont({
        fontName: 'icons',
        appendUnicode: true,
        formats: ['woff']
    }))
    .on('glyphs', function(glyphs, options) {
         console.log(glyphs, options);
         // the value for unicode in the glyphs object is a question mark in a box
     })
    .pipe(gulp.dest(paths.styles));
});

问题：

当我在控制台记录 glyphs 对象时，glyphs 对象中 unicode 的值是一个方框中的问号。

我已经尝试从头开始重新安装所有模块，以防万一出现异常情况而没有运气。

任何帮助将不胜感激。

Answer 1

背景故事：

好的 - 所以我研究了 svgicons2svgfont 模块并找到了罪魁祸首。在line 48 of src/metadata.js 周围有以下内容：

metadata.unicode[0] = String.fromCodePoint(options.startUnicode++);

我注意到在此下方，模块正在对生成的字符串进行一些操作，以获取用于附加到文件名的 unicode 值。以下是提取 unicode 值的方法：

metadata.unicode[0].codePointAt(0).toString(16).toUpperCase();

解决方案：

我对我的 scss 模板文件中的 glyph 变量做了同样的事情，现在我的 unicode 值可以正确填充。

$icons: (<% _.each(glyphs, function(glyph) { %>
    <%= glyph.name %>: "\<%= glyph.unicode[0].codePointAt(0).toString(16).toUpperCase() %>",<% }) %>
);

这对我来说似乎完全荒谬和困惑。更令人沮丧的是，几乎没有关于从这些使用 svgicons2svgfont 的库创建 css 模板的文档。

我希望这可以帮助其他同样令人沮丧的人

我将尝试将其变成一个拉取请求，以便将来使用这些模块的人更清楚。