2014-08-04 00:01:39 +02:00
|
|
|
# inline-critical
|
|
|
|
|
2014-08-04 00:05:54 +02:00
|
|
|
Inline critical-path css and load the existing stylesheets asynchronously.
|
2014-09-09 12:56:12 +02:00
|
|
|
Existing link tags will also be wrapped in ```<noscript>``` so the users with javscript disabled will see the site rendered normally.
|
2014-08-04 00:01:39 +02:00
|
|
|
|
2014-08-04 00:07:35 +02:00
|
|
|
[![build status](https://secure.travis-ci.org/bezoerb/inline-critical.svg)](http://travis-ci.org/bezoerb/inline-critical)
|
2014-08-04 00:01:39 +02:00
|
|
|
|
|
|
|
## Installation
|
|
|
|
|
|
|
|
This module is installed via npm:
|
|
|
|
|
|
|
|
``` bash
|
|
|
|
$ npm install inline-critical
|
|
|
|
```
|
|
|
|
|
|
|
|
## Example Usage
|
|
|
|
|
|
|
|
``` js
|
2014-08-04 00:05:54 +02:00
|
|
|
var inline = require('inline-critical');
|
|
|
|
var html = fs.readFileSync('test/fixtures/index.html', 'utf8');
|
|
|
|
var critical = fs.readFileSync('test/fixtures/critical.css', 'utf8');
|
|
|
|
|
|
|
|
var inlined = inline(html, critical);
|
2014-08-04 00:01:39 +02:00
|
|
|
```
|
2014-10-19 03:16:34 +02:00
|
|
|
|
|
|
|
## `inline(html, styles, options?)
|
|
|
|
|
|
|
|
- `html` is the HTML you want to use to inline your critical styles, or any other styles
|
|
|
|
- `styles` are the styles you're looking to inline
|
|
|
|
- `options` is an optional configuration object
|
|
|
|
- `minify` will minify the styles before inlining
|
|
|
|
- `extract` will remove the inlined styles from any stylesheets referenced in the HTML
|
|
|
|
- `basePath` will be used when extracting styles to find the files references by `href` attributes
|
|
|
|
|
|
|
|
## License
|
|
|
|
|
|
|
|
MIT
|