Question

我正在使用以下Gulp任务从Font Awesome Bower包中复制所需的字体，这样可以正常工作并输出如下文件：

App＆gt;构建＆gt;字体＆gt;字体文件

gulp.task('copyfonts', function() {
   gulp.src('./bower_components/components-font-awesome/fonts/**/*.{ttf,woff,eof,svg}')
   .pipe(gulp.dest('./fonts'));
});

我正在尝试重构此任务，以便使用**通配符从任何bower包（例如Bootstrap）移动字体。

gulp.task('copyfonts', function() {
   gulp.src('./bower_components/**/fonts/**/*.{ttf,woff,eof,svg}')
   .pipe(gulp.dest('./fonts'));
});

App＆gt;构建＆gt;字体＆gt;

Bootstrap＆gt;字体＆gt;字体文件 Font-Awesome＆gt;字体＆gt;字体文件

TL; DR

使用我的第二种方法是复制文件，如上所示，复制包文件夹并将其作为子文件移动到'fonts'文件夹。任何人都可以帮我看看我哪里出错......

Answer 1

我在这里参加聚会的时间有点晚了，但对于未来偶然发现这一点的人：我相信你的字体中有一个拼写错误： eof 应该 eot

gulp.src('./bower_components/**/fonts/**/*.{ttf,woff,eof,svg}')

应该是

gulp.src('./bower_components/**/fonts/**/*.{ttf,woff,eot,svg}')

Answer 2

最好不要总是依赖包将字体保存在特定文件夹中，这些事情可能会发生变化。

在字体（一个文件夹级别）之前，您可能错过了另一个/**/。或者为什么所有这些检查，你知道字体将具有什么扩展，可能添加像**/*.{ttf,woff,eof,svg}

这样的通配符

你有没有试过用gulp-main-bower-files管理它？ https://github.com/ck86/main-bower-files

Answer 3

你可以测试这个任务我是靠它工作的

gulp.task('copyfonts', () =>
gulp.src('./app/assets/fonts/*')
    .pipe(gulp.dest('./dist/assets/fonts'))

）;

Answer 4

我遇到了同样的问题。运行gulp构建后，我的字体从未成功复制到我的dest / fonts文件夹中。问题出在我的gulp.js文件中的这些行中：

function fonts() {
  return src('app/fonts/**/*.{eot,svg,ttf,woff,woff2}')
    .pipe($.if(!isProd, dest('.tmp/fonts'), dest('dist/fonts')));
};

编辑完最后一行后，我的字体成功复制了！

function fonts() {
  return src('app/fonts/**/*.{eot,svg,ttf,woff,woff2}')
    .pipe(dest('dist/fonts'));
};

使用Gulp将所有bower包字体文件复制到build目录

4 个答案: