参考如下网站

https://github.com/hjzheng/CUF_meeting_knowledge_share/tree/master/2015-7-24/gulp-test-iconfont

gulpfile.js

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

var iconfontCss = require('gulp-iconfont-css');

var template = require('gulp-template');
var fs = require('fs');

var icons = fs.readdirSync('src/style/svg');

icons = icons.map(function(icon) {
return icon.replace(/\.\w+$/, '');
});

var cssName = 'iconfont'; //生成的css名称
gulp.task('icon', function() {
let dirname = 'src/style';
return gulp
.src([`${dirname}/svg/*.svg`])

    .pipe(  
        iconfontCss({  
            fontName: 'iconfont', // iconfont.css的font-family值  
            path: \`${dirname}/template/iconfont.template.less\`, //css模版文件  
            targetPath: \`../${cssName}.css\`, //css生成文件  
            fontPath: 'fonts/' //iconfont.template.less文件中的fontPath  
        })  
    )  
    .pipe(  
        iconfont({  
            fontName: 'iconfont',  
            formats: \['svg', 'ttf', 'eot', 'woff', 'woff2'\],  
            normalize: true  
        })  
    )  
    .pipe(gulp.dest(\`${dirname}/fonts\`)); //svg的字体文件存放位置  

});

gulp.task('example', function() {
let dirname = 'src/style';
gulp.src(`${dirname}/example/index.html`) //样式例子文件
.pipe(template({ icons: icons, cssName: cssName }))
.pipe(gulp.dest(`${dirname}`)); //样式例子文件存放位置
});
gulp.task('default', ['icon', 'example']);

iconfont-template.less

@font-face {
font-family: "<%= fontName %>";
src: url('<%= fontPath %><%= fontName %>.eot');
src: url('<%= fontPath %><%= fontName %>.eot?#iefix') format('eot'),
url('<%= fontPath %><%= fontName %>.woff') format('woff'),
url('<%= fontPath %><%= fontName %>.ttf') format('truetype'),
url('<%= fontPath %><%= fontName %>.svg#<%= fontName %>') format('svg');
font-weight: normal;
font-style: normal;
}

.icon:before {
font-family: "<%= fontName %>";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-style: normal;
font-variant: normal;
font-weight: normal;
/* speak: none; only necessary if not using the private unicode range (firstGlyph option) */
text-decoration: none;
text-transform: none;
}

<% \_.each(glyphs, function(glyph) { %> .icon-<%= glyph.fileName %>:before { /\* content: "\<%= JSON.stringify(glyph) %>";\*/ content: "\<%= glyph.codePoint %>"; } <% }); %>

example/index.html