1.0.6 • Published 5 years ago

@e-goi/css-inliner v1.0.6

Weekly downloads
2
License
MIT
Repository
github
Last release
5 years ago

css-inliner

Inline your css 100% in the browser and with no dependencies

Install

To install the package, you can use npm or yarn:

  yarn add @e-goi/css-inliner

Usage

Import the package on your code

import { cssInliner } from '@e-goi/css-inliner';

Use the main function cssInliner to inject the style on the elements.

cssInliner(
  document.querySelector('html').innerHTML,
  {
    properties: {
      width: true,
      border: true,
      cellpadding: true,
      cellspacing: true
    }
  }
).then(formatted => {
  console.log(formatted);
});

Configuration

The second parameter of cssInliner is a configuration object.

Basic configuration

ConfigurationTypeDefaultDescription
urlstringemptyurl to replace on relative path src and href
preserveMediaQueriesbooleantruedefine if preserver or not @media queries
applyApplyTags-tags to get the styles
propertiesApplyProperties-apply style to some attributes
removeRemoveTags-remove tags after set the css inline

ApplyTags configuration

ConfigurationTypeDefaultDescription
stylebooleantrueapply style tags
linkbooleantrueapply content from link tags

ApplyProperties configuration

ConfigurationTypeDefaultDescription
widthbooleanfalseapply width style to width property
borderbooleanfalseapply border style to table border property
cellpaddingbooleanfalseapply td padding style to table cellpadding property
cellspacingbooleanfalseapply border-spacing style to table cellspacing property

RemoveTags configuration

ConfigurationTypeDefaultDescription
stylebooleantrueremove style tags
linkbooleantrueremove link tags
scriptbooleantrueremove script tags
1.0.6

5 years ago

1.0.5

5 years ago

1.0.4

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago