После того, как браузер gulp не смог найти шрифты

Question

После запуска моей задачи для копирования шрифтов из bower_component браузер, похоже, путается с правильным путем.

Это глоток задача для шрифтов:

// Fonts 
gulp.task('fonts', function() { 
    return gulp.src(bowerDir + '/open-sans-fontface/fonts/**/*.{eot,svg,ttf,woff,woff2}', function (err) {}) 
     .pipe(gulp.dest(dest + 'fonts')); 
}); 

И это глоток задача стилей:

// Styles 
gulp.task('styles', function() { 
    return plugins.sass(src + 'styles/main.scss', { 
      style: 'expanded', 
      loadPath: [ 
      // './resources/sass', 
      bowerDir + '/bootstrap-sass/assets/stylesheets', 
      bowerDir + '/font-awesome/scss', 
      bowerDir + '/open-sans-fontface' 
      ] 
     }) 
     .pipe(plugins.autoprefixer('last 2 version')) 
     .pipe(gulp.dest(dest + 'styles')) 
     .pipe(plugins.rename({ suffix: '.min' })) 
     .pipe(plugins.cssnano()) 
     .pipe(gulp.dest(dest + 'styles')) 
     .pipe(reload({stream: true})); 
     // .pipe(plugins.notify({ message: 'Styles task complete' })); 
}); 

Как настроить файл глоток, поэтому созданный внешний вид CSS-файлы для правильного пути?

Answer 1

Вы можете использовать gulp-replace. Пример:

gulp.task('styles', function() { 
    return gulp.src('src/styles/main.scss') 
    .pipe(plugins.sass()) 
    .pipe(plugins.replace('original-path/fonts/', 'new-path/fonts/')) 
    .pipe(gulp.dest('dist')); 
}); 

Если, например, bootstrap имел шрифты под original-path/fonts/, этот путь теперь будет заменен new-path/fonts/ после выполнения задачи styles.