JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 102
  • Score
    100M100P100Q71661F
  • License MIT

Package that adds `@keyframes` from magic.css.

Package Exports

  • postcss-magic.css-data

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (postcss-magic.css-data) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

postcss-magic.css-data

Autogenerated data for postcss-animations plugin.

Parsed all @keyframes from magic.css.

Install

yarn add -D postcss-magic.css-data postcss-animations
# or npm i -D postcss-magic.css-data postcss-animations

Use

const postcss = require("postcss");
const postcssAnimations = require("postcss-animations");

(async () => {
  const CSS = `.my-openDownRightOut { animation-name: openDownRightOut; }`;
  const PLUGINS = [
    postcssAnimations({
      data: [require("postcss-magic.css-data")],
      checkDuplications: true,
      disableCheckCssVariables: true
    })
  ];

  try {
    const { css, messages } = await postcss(PLUGINS).process(
      CSS /*, {from,to}*/
    );
    messages.map(msg => console.log(msg.toString()));

    console.log(css);
    /*
          .my-openDownRightOut { animation-name: openDownRightOut; }
          @keyframes openDownRightOut { }
        */
  } catch (e) {
    console.error(e);
  }
})();

Other animation data:

Update data:

git clone https://github.com/retyui/postcss-magic.css-data
cd postcss-magic.css-data
yarn
yarn build