Html 如何从多个外部URL获取关键css？

我目前有以下gulpfile.js，它从几个URL获取关键css并创建两个单独的文件：

var gulp = require('gulp');
var purge = require('gulp-css-purge');
var concatCss = require('gulp-concat-css');
var critical = require('critical');

gulp.task('critical', ['generate'], function () {
    gulp.src(['./css/critical-*.css'])
        .pipe(concatCss('./css/critical.css'))
        .pipe(purge())
        .pipe(gulp.dest('.'));
});

gulp.task('generate', function () {
    critical.generate({
        base: './',
        src: 'http://example.com/category.html',
        dimensions: [{
            width: 1280,
            height: 960
        }],
        dest: 'css/critical-category.css',
        minify: true,
        extract: false,
        pathPrefix: '/css',
        ignore: ['font-face']
    });

    critical.generate({
        base: './',
        src: 'http://example.com/',
        dimensions: [{
            width: 1280,
            height: 960
        }],
        dest: 'css/critical-home.css',
        minify: true,
        extract: false,
        pathPrefix: '/css',
        ignore: ['font-face']
    });
});

我创建

critical-*.css

文件的唯一原因是以后将它们连接起来，并将重复内容删除到单个

critical.css

文件中

有没有更有效的方法？我一直在尝试使用生成的关键css作为流的一部分，就像在critical上一样，但我无法使用外部URL使其工作