如何使用 gulp-usemin 包字体

Question

我目前正在使用gulp-usemin pluign，但是我正在努力解决一件事：使用软件包提供的图像！

  <!-- build:css lib/css/main.min.css -->
  <link rel="stylesheet" type="text/css" href="bower_components/font-awesome/css/font-awesome.css">
  <!-- endbuild -->

font-awesome bower 包还附带字体：

bower_components/font-awesome/fonts/**.*

我目前使用 usemin 插件编译我的 css：

gulp.task('usemin', function() {
    return gulp.src('src/index.html')
        .pipe(usemin({
            css: [minifyCss(), 'concat'],
        }))
        .pipe(gulp.dest('dist/'));
});

现在这会使用上面的构建路径扫描我的 HTML，并成功地缩小它。

但是我遇到的问题是，现在我的字体很棒的 CSS 正在错误的位置寻找字体，因为它们不再在同一个目录中。

我该如何解决这个问题？

Answer 1

通过找到这个问题来解决这个问题：Can you remove a folder structure when copying files in gulp?

我现在的任务是使用gulp-rename:

gulp.task('copy-bower_fonts', function() {
    return gulp.src(paths.bower_fonts)
        .pipe(rename({
            dirname: '/fonts'
        }))
        .pipe(gulp.dest('dist/lib'));
});

寻找../fonts/ 的包中的字体现在指向正确的位置。