使用css缩小的远程字体导入 [英] Remote font imports with css minification

问题描述

我试图连接&缩小包括css在内的所有凉亭软件包资产。其中之一是靴子的设计和它导入谷歌字体。问题是，在其上运行css任务会导致超时异常。我猜它试图下载这些字体，并且它需要很长时间，因为每次都不会发生异常。

I'm trying to concatenate & minify all bower package assets including css. One of them is bootswatch design and it imports google fonts. Problem is, running css tasks on it results in timeout exception. I'm guessing it is trying to download those fonts and it takes too long as exception does not occur every single time.

我该如何解决它？

Gulp进口：

var gulpMinifyCss = require('gulp-minify-css');
var gulpConcatCss = require('gulp-concat-css');
var mainBowerFiles = require('main-bower-files');
var gulpFilter = require('gulp-filter');

Gulp任务：

Gulp task:

gulp.task('compileBowerCss', function(){
    return gulp
        .src(mainBowerFiles())
        .pipe(gulpFilter('*.css'))
        .pipe(gulpConcatCss('bower.css'))
        .pipe(gulpMinifyCss())
        .pipe(gulp.dest(assetsFolder + cssFolder));
});

例外：

Exception:

events.js:85
  throw er; // Unhandled 'error' event
        ^
Error: Broken @import declaration of "https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" - timeout

单独运行这个任务并且没有其他任何东西能够正常运行（就我可以告诉的极限测试而言），但是运行它与其他任务导致提到的错误。

Running this task alone and nothing else works fine always (as far as I can tell with limit testing), but running it in conjuction with other tasks results in mentioned error.

推荐答案

解决方案：将 processImport：false 选项传递给minifyCss管道。

I'd same bug. Solution: pass processImport: false option to minifyCss pipe.

.pipe(gulpMinifyCss({processImport: false}))

这篇关于使用css缩小的远程字体导入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！