使用gulp-iconfont

Question

所以，我正在使用gulp-iconfont从svg图标生成图标字体。我已经在下一个方面设置了任务：

gulp.task('iconfont', function(){
  gulp.src(['src/assets/icons/*.svg'])
    .pipe($.iconfont({
      fontName: 'material',
      normalize: true
    }))
    .on('codepoints', function(codepoints) {
      console.log(codepoints);
      gulp.src('src/templates/material.styl')
        .pipe($.consolidate('mustache', {
          glyphs: codepoints,
          fontName: 'material',
          fontPath: '../fonts/',
          className: 'md'
        }))
        .pipe(gulp.dest('src/styles/plugins'));
    })
    .pipe(gulp.dest('build/fonts/'));
});

console.log(codepoints)给了我类似的东西：

[ { name: 'notifications', codepoint: 57345 },
  { name: 'offline', codepoint: 57346 },
  { name: 'online', codepoint: 57347 },
...
]

我在我的css中使用这些代码点来生成类似的东西：

.md-notifications {
  content: "\57345";
}

它不起作用，有一个空的空间而不是我的图标。但是，如果我使用直接从生成的svg字体获得的代码点，它可以工作：

.md-notifications {
  content: "\E001"
}

我做错了什么？

Answer 1

在JavaScript中，当您使用反斜杠后跟数字时，您将创建八进制转义序列。斜杠后面的数字必须是8（八进制）。

代码点57345应为“\ 160001”。

您还可以使用“\ u”前缀执行十六进制转义序列。所以57345也可以作为“\ uE001”。

你声称的第二个工作“\ E001”是不对的。并且不会做你认为它做的事情。它应该只是生成字符串“E001”。