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

How to use this withiout grunt and gulp?

JulianeAlbuquerque opened this issue · comments

Hello, I don't know how to use this without grunt and gulp, Can you help me please?

It's pretty ease to use:

var criticalcss = require("criticalcss"); //install it via npm
var fs = require('fs'); //install it via npm

criticalcss.getRules('common/css/styles.css', function(err, output) {
        if (err) {
            throw new Error(err);
        } else {
            criticalcss.findCritical("https://www.site.com/", {rules: JSON.parse(output)}, function (err, output) {
                if (err) {
                    throw new Error(err);
                } else {
                    fs.writeFileSync('common/css/critical.css', output);
                }
            });
        }
    });

Profit! You got critical.css in common/css/ folder.

I'm new to npm also, outside of gulp. Is this the kind of thing that you run npm run and then whatever you called the script in the package.json file?

You can run it using scripts section in the package.json and thennpm run or you can do it using gulp (as far as it's a task runner).