0

I'm building out a new gulpfile and one of the tasks is to use purgecss

However every time I run the task I get this error.

TypeError: Cannot call a class as a function

I cannot figure why this is happening and googling didn't help me. Javascript is not a strong area for me.

The gulp task.

/**
 * Custom PurgeCSS Extractor
 * https://gist.github.com/taylorbryant/91fc05b12472a88a8b6494f610647cd4
 */
class TailwindExtractor {
  static extract(content) {
    return content.match(/[A-z0-9-:\/]+/g);
  }
}

// purge task
gulp.task("purge", async () => {

  return gulp.src(pkg.paths.dist.css + '*.css')
    .pipe($.purgecss({
      content: [pkg.paths.templates + "/**/*.{html,htm,twig}", pkg.paths.templates + "/**/**/*.{html,htm,twig}", pkg.paths.templates + "*.{html,htm,twig}"],

      extractors: [{
        extractor: TailwindExtractor,
        extensions: ["html", "htm", "twig"]
      }]
    }))

    .pipe($.if(["*.css", "!*.purge.css"],
      $.rename({
        suffix: ".purge"
      })
    ))
    .pipe(gulp.dest(pkg.paths.dist.css))
});
// end purge task

Appreciate your help.

EDIT - switched to a simplified task but still getting the same error

/**
 * Custom PurgeCSS Extractor
 * https://gist.github.com/taylorbryant/91fc05b12472a88a8b6494f610647cd4
 */
class TailwindExtractor {
  static extract(content) {
    return content.match(/[A-z0-9-:\/]+/g);
  }
}
// purge task
gulp.task("purge", async () => {

  $.fancylog.info("-> purging unused css");

  return gulp.src(pkg.paths.dist.css + '*.css')
    .pipe($.plumber({ errorHandler: onError }))

    .pipe(
      $.purgecss({
        content: [pkg.paths.templates + "*.{html,htm,twig}"]
      })
    )
    .pipe(gulp.dest(pkg.paths.dist.css))
});
CreateSean
  • 1,286
  • 1
  • 21
  • 42
  • I haven’t looked up the API or anything but how about `extractor: () => new TailwindExtractor()`? – Ry- Jun 08 '19 at 16:20
  • @Ry- that didn't work. Thanks though. Still gets the same error. – CreateSean Jun 08 '19 at 17:17
  • If you delete the `class TailwindExtractor` from the simplified task (it’s unused, right?), do you still get the error? Also, what’s the stack trace? – Ry- Jun 08 '19 at 20:29
  • I tried that and no go. At this point I'm moving my build process to Laravel Mix -it's easier to read/write than gulp. – CreateSean Jun 09 '19 at 12:38

0 Answers0