You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

README.md 2.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. # extract-css [![Build Status](https://travis-ci.org/jonkemp/extract-css.svg?branch=master)](https://travis-ci.org/jonkemp/extract-css) [![Coverage Status](https://coveralls.io/repos/jonkemp/extract-css/badge.svg?branch=master&service=github)](https://coveralls.io/github/jonkemp/extract-css?branch=master)
  2. [![NPM](https://nodei.co/npm/extract-css.png?downloads=true)](https://nodei.co/npm/extract-css/)
  3. > Extract the CSS from an HTML document.
  4. ## Install
  5. Install with [npm](https://npmjs.org/package/extract-css)
  6. ```
  7. npm install --save extract-css
  8. ```
  9. ## Usage
  10. ```js
  11. var extractCss = require('extract-css');
  12. var options = {
  13. url: './',
  14. applyStyleTags: true,
  15. removeStyleTags: true,
  16. applyLinkTags: true,
  17. removeLinkTags: true,
  18. preserveMediaQueries: false
  19. };
  20. extractCss(document, options, function (err, html, css) {
  21. console.log(html);
  22. console.log(css);
  23. });
  24. ```
  25. ## API
  26. ### extractCss(html, options, callback)
  27. #### options.applyStyleTags
  28. Type: `Boolean`
  29. Whether to inline styles in `<style></style>`.
  30. #### options.applyLinkTags
  31. Type: `Boolean`
  32. Whether to resolve `<link rel="stylesheet">` tags and inline the resulting styles.
  33. #### options.removeStyleTags
  34. Type: `Boolean`
  35. Whether to remove the original `<style></style>` tags after (possibly) inlining the css from them.
  36. #### options.removeLinkTags
  37. Type: `Boolean`
  38. Whether to remove the original `<link rel="stylesheet">` tags after (possibly) inlining the css from them.
  39. #### options.url
  40. Type: `String`
  41. How to resolve hrefs. Required.
  42. #### options.preserveMediaQueries
  43. Type: `Boolean`
  44. Preserves all media queries (and contained styles) within `<style></style>` tags as a refinement when `removeStyleTags` is `true`. Other styles are removed.
  45. #### options.codeBlocks
  46. Type: `Object`
  47. Default: `{ EJS: { start: '<%', end: '%>' }, HBS: { start: '{{', end: '}}' } }`
  48. An object where each value has a `start` and `end` to specify fenced code blocks that should be ignored during parsing. For example, Handlebars (hbs) templates are `HBS: {start: '{{', end: '}}'}`. Note that `codeBlocks` is a dictionary which can contain many different code blocks, so don't do `codeBlocks: {...}` do `codeBlocks.myBlock = {...}`.
  49. ### Special markup
  50. #### data-embed
  51. When a data-embed attribute is present on a <style></style> tag, extract-css will not inline the styles and will not remove the <style></style> tags.
  52. This can be used to embed email client support hacks that rely on css selectors into your email templates.
  53. ## Credit
  54. The code for this module was originally taken from the [Juice](https://github.com/Automattic/juice) library.
  55. ## License
  56. MIT © [Jonathan Kemp](http://jonkemp.com)