filamentgroup / criticalCSS

Finds the Above the Fold CSS for your page, and outputs it into a file

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Phantomjs error

alessioalex opened this issue · comments

Got this on Windows:

$ node criticalcss.js

Something went wrong with phantomjs...

c:\Users\avladutu\workplace\node-stuff\criticalcss.js:15
          throw new Error(err);
                ^
Error: Error: PHANTOM ERROR: TypeError: 'undefined' is not a function (evaluatin
g 'rules.map(getCriticalRules)')
TRACE:
 -> C:/Users/avladutu/workplace/node-stuff/node_modules/criticalcss/lib/critical
css.js: 67
 -> c:\Users\avladutu\workplace\node-stuff\node_modules\criticalcss\lib\critical
runner.js: 95
 -> :/modules/webpage.js: 281
    at c:\Users\avladutu\workplace\node-stuff\criticalcss.js:15:17
    at c:\Users\avladutu\workplace\node-stuff\node_modules\criticalcss\critical.
js:143:6
    at ChildProcess.exithandler (child_process.js:662:7)
    at ChildProcess.emit (events.js:98:17)
    at maybeClose (child_process.js:766:16)
    at Process.ChildProcess._handle.onexit (child_process.js:833:5)

The rules are the ones returned from criticalcss.getRules so I don't think there's a problem in my code. Any advice?

Hi @alessioalex,

Can you show me how you're calling the getRules and findCritical functions?

Sure, there you go:

var request = require('request');
var criticalcss = require("criticalcss");
var fs = require('fs');
var tmpDir = require('os').tmpdir();

var cssUrl = 'http:/site.com/style.css';
var cssPath = tmpDir + '/style.css';
request(cssUrl).pipe(fs.createWriteStream(cssPath)).on('close', function() {
  criticalcss.getRules(cssPath, function(err, output) {
    if (err) {
      throw new Error(err);
    } else {
      criticalcss.findCritical("https://site.com/", { rules: output }, function(err, output) {
        if (err) {
          throw new Error(err);
        } else {
          console.log(output);
        }
      });
    }
  });
});

Hrm,

Try:

var request = require('request');
var criticalcss = require("criticalcss");
var fs = require('fs');
var tmpDir = require('os').tmpdir();

var cssUrl = 'http:/site.com/style.css';
var cssPath = tmpDir + '/style.css';
request(cssUrl).pipe(fs.createWriteStream(cssPath)).on('close', function() {
  criticalcss.getRules(cssPath, function(err, output) {
    if (err) {
      throw new Error(err);
    } else {
      criticalcss.findCritical("https://site.com/", { rules: JSON.parse(output) }, function(err, output) {
        if (err) {
          throw new Error(err);
        } else {
          console.log(output);
        }
      });
    }
  });
});

Thank you, it worked.

Btw could you put this example in the README? It takes a couple of minutes to figure out just how to get started and I think this could speed up things.

Absolutely. Doing that RIGHT now.