How to use the critical.generate function in critical

async snapshot(isProduction = true) {
    let cssBundles = this.getCSSBundles();
    let content = await snapshot({
      page: this,
      cssBundles,
      isProduction
    });

    if (cssBundles.length > 0) {
      // Extract critical css
      let criticalCss = await critical.generate({
        html: content,
        base: this.options.outDir,
        folder: this.options.outDir,
        minify: true,
        ignore: ['@font-face', /url\(/]
      });

      content = content.replace('/* BLAZINGLY INLINE CRITICAL CSS */', criticalCss);
      await fs.writeFile(path.join(this.outDir, 'critical.css'), criticalCss);
    }

    await fs.writeFile(path.join(this.outDir, 'index.html'), content);
  }
}

function processCriticalCss(element, i, callback) {
  const url = argv.url || kittn.cssabove.url
  const criticalSrc = `${url}${element.url}`
  const BASE_PATH = path.resolve(__dirname, '..')
  const criticalDest = `${`${BASE_PATH}/${kittn.src.templates}${element.template}`}_critical.min.css`
  console.log(`-> Generating critical CSS: ${chalk.cyan(criticalSrc)} -> ${chalk.magenta(criticalDest)}`)

  critical.generate(
    {
      src: criticalSrc,
      dest: criticalDest,
      inline: kittn.cssabove.inline,
      ignore: kittn.cssabove.ignore,
      include: kittn.cssabove.include,
      css: [
        kittn.dist.css + kittn.cssabove.cssfile
      ],
      minify: kittn.cssabove.minify,
      height: kittn.cssabove.height,
      width: kittn.cssabove.width
    },
    (err, output) => {
      callback();
    }

return new Promise((resolve, reject) => {
                critical
                    .generate({
                        ...options,
                        ...TASK_CONFIG.critical
                    })
                    .catch(e => {
                        console.error(e)
                        reject(e)
                    })
                    .then(output => {
                        gulp
                            .src(path.resolve(process.env.PWD, source))
                            .pipe(
                                htmlreplace(
                                    {
                                        critical: {
                                            src: null,

export const criticalCss = done => {
    if (isProduction) {
        critical.generate({
            base: DIST,
            src: 'index.html',
            dest: 'index.html',
            inline: true,
            minify: true,
            dimensions: [{
                height: 320,
                width: 480
            }, {
                height: 600,
                width: 650
            }, {
                height: 700,
                width: 960
            }, {
                height: 900,

base: './',
        src: 'index-origin.html',
        dimensions: [{
            height: 480,
            width: 320
        }, {
            height: 900,
            width: 1200
        }],
        dest: 'index.html',
        minify: true,
        extract: true,
        ignore: ['@font-face']
    };

    return critical.generate(options);
};

kc.cssabove.sources.forEach(function(item) {
      return critical.generate({
        inline: kc.cssabove.inline,
        base: kc.dist.markup,
        src: item,
        dest: item,
        minify: kc.cssabove.minify,
        width: kc.cssabove.width,
        height: kc.cssabove.height
      })
    })
  }

.subscribe((tmp) => {
      const opts = {...options, ...{
        base: resolve(tmp, options.base || ''),
        dest: resolve(tmp, options.dest)
      }};

      critical.generate(opts, (err, output) => {
        subscription.unsubscribe();
        callback(err);
      });
    })
  }