postcss-icss-keyframes

PostCSS plugin for css-modules to local-scope keyframes

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
postcss-icss-keyframes
520.2.15 years ago5 years agoMinified + gzip package size for postcss-icss-keyframes in KB

Readme

postcss-icss-keyframes !Build Statustravis-imgtravis
PostCSS plugin for css-modules to local-scope keyframes. ```css @keyframes foo { from { width: 10px; } to { width: 100px; } } / transforms to / :export { foo: scopefoo } @keyframes scopefoo { from { width: 10px; } to { width: 100px; } } ```

Usage

```js postcss( require('postcss-icss-keyframes')(options) ) ``` See PostCSS docs for examples for your environment.

Options

generateScopeName(keyframesName, filepath, css)

Converts every new animation name in @keyframes defintion to global alias. By default returns __filename__keyframesName.

Importing animation name from another file

Via postcss-modules-values ``` / imported.css / @keyframes foo {} / importer.css / @value foo from './imported.css'; .bar { animation-name: foo; } ```

Using globally defined keyframes

Animation names are not replaced if css module does not contain @keyframes or @value defintions with the same name. ``` .foo { animation-name: fade-in; } ```

Messages

postcss-icss-keyframes passes result.messages for each defined keyframes ``` { plugin: 'postcss-icss-keyframes', type: 'icss-scoped', name: string, // local name value: string // scoped name } ```
License
MIT © Bogdan Chadkin