Postcss-move-it NPM

Postcss-move-it

Postcss-move-it adds keyframes by animation name. Inspired by `postcss-animation`.

Example

input:

.foo {
  animation-name: fadeIn;
}

output:

.foo {
  animation-name: fadeIn;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

Currently there is support for animate.css, but more will be added soon (magic, animista, etc.) The plugin will be constantly updated, and if you want to take part, you are welcome!:wave:

Install

npm install postcss-move-it

Usage

If you're using a Webpack. Add this code to the postcss.config.js:

require("postcss-move-it")

For Gulp:

const postcss = require('gulp-postcss');
const gulp = require('gulp');
const postcssMoveIt = require('postcss-move-it');

gulp.task('default', function () {
    var processors = [
        postcssMoveIt()
    ];
    return gulp.src('./src/*.css')
        .pipe(postcss(processors))
        .pipe(gulp.dest('./dest'));
});