tonix-html-autoprefixer

Autoprefix all CSS inside an html page - CSS inside style tags and inside style attributes

Usage no npm install needed!

<script type="module">
  import tonixHtmlAutoprefixer from 'https://cdn.skypack.dev/tonix-html-autoprefixer';
</script>

README

tonix-html-autoprefixer

This package is a fork of the original html-autoprefixer repo.

This fork comes with updated NPM packages.

The original README.md follows below this paragraph.

html-autoprefixer

html-autoprefixer

Autoprefix all CSS inside an html page - CSS inside style tags and inside style attributes.

BuildStatus NPM version

var prefixed = htmlAutoprefixer.process(htmlString);

Installation

npm install html-autoprefixer --save

Usage

You pass an html string to .process and it returns the processed html.

var htmlAutoprefixer = require("html-autoprefixer");
var htmlString =
  '<html><head><style>:fullscreen a { transition: transform 1s; }</style></head><body><h1 style=\'font-feature-settings: "liga", "dlig";\'>Hello</h1></body></html>';

var prefixed = htmlAutoprefixer.process(htmlString);

You can optionally pass cheerio options.

var htmlString = "<HTML></HTML>";

var prefixed = htmlAutoprefixer.process(htmlString, { lowerCaseTags: true });
// <html></html>

Gulp

Using Gulp? Use gulp-html-autoprefixer.

var gulp = require("gulp");
var htmlAutoprefixer = require("gulp-html-autoprefixer");

gulp.task("html-autoprefix", function () {
  return gulp
    .src("./path/to/index-or-other.html")
    .pipe(htmlAutoprefixer())
    .pipe(gulp.dest("dist"));
});

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Added some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request

Running tests

npm install
npm test