Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

coffeekraken-criticalcss

Package Overview
Dependencies
Maintainers
1
Versions
1
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

coffeekraken-criticalcss

Simply and quickly generate the critical css depending on a list of pages to take as source

  • 1.0.0
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
1
decreased by-50%
Maintainers
1
Weekly downloads
 
Created
Source

Coffeekraken criticalcss

Simply and quickly generate the critical css depending on a list of pages to take as source.

Table of content

  1. Install
  2. Get Started
  3. CLI Options
  4. pages.json
  5. Contribute
  6. Who are Coffeekraken?
  7. Licence

Install

npm install coffeekraken-criticalcss --save-dev

Get Started

Use the CLI as follow:

coffeekraken-criticalcss -o dist/css/critical.css -c dist/css/style.css

CLI Options

Here's all the CLI options available:

-o|--output

Output critical css file

  • default : dist/css/critical.css

-c|--css

Css file to use to generate critical one

  • default : dist/css/style.css

-p|--pages

List of pages urls to process (space separated). By default, it would try to find a pages.json file in your project root folder, then it would try to find a pages property in your package.json. See bellow for more info on that.

  • default : null

-h|--host

Hostname on which to make pages requests

  • default : http://localhost:8080

-w|--width

Width of the viewport to calculate the critical css

  • default : 1200

-h|--height

Height of the viewport to calculate the critical css

  • default : 900

pages.json

You can create a pages.json file at your project root folder that will be used to generate the critical css from the pages url defined here. Here's a sample pages.json file:

{
  "home": {
    "title": "Homepage",
    "url": "/"
  },
  "contact": {
    "title": "Contact",
    "url": "/contact"
  }
}

You can if you prefere have the same structure in your package.json file under a pages property.

Contribute

This is an open source project and will ever be! You are more that welcomed to contribute to his development and make it more awesome every day. To do so, you have several possibilities:

  1. Share the love ❤️
  2. Declare issues
  3. Fix issues
  4. Add features
  5. Build web component

Who are Coffeekraken

We try to be some cool guys that build some cool tools to make our (and yours hopefully) every day life better.

More on who we are

License

The code is available under the MIT license. This mean that you can use, modify, or do whatever you want with it. This mean also that it is shipped to you for free, so don't be a hater and if you find some issues, etc... feel free to contribute instead of sharing your frustrations on social networks like an asshole...

Keywords

FAQs

Package last updated on 24 Oct 2018

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc