fela-plugin-validator

fela-plugin-validator

Enforces object validation for keyframes and rules. Logs invalid properties to the console. One might also enable automatic property deletion.

Installation

npm i --save fela-plugin-validator

Assuming you are using npm as your package manager you can just npm install.
Otherwise we also provide a UMD. You can easily use it via unpkg. It registers a FelaPluginValidator global.

<!-- Fela (Development): Unminified version including all warnings -->
<script src="https://unpkg.com/fela-plugin-validator@4.2.6/dist/fela-plugin-validator.js"></script>
<!-- Fela (Production): Minified version -->
<script src="https://unpkg.com/fela-plugin-validator@4.2.6/dist/fela-plugin-validator.min.js"></script>

Usage

Make sure to read the documentation on how to use plugins.

import { createRenderer } from 'fela'
import validator from 'fela-plugin-validator'

const renderer = createRenderer({
  plugins: [ validator() ]
})

Configuration

Options

Option	Value	Default	Description
logInvalid	(boolean)	true	logs invalid properties/values
deleteInvalid	(boolean)	false	deletes invalid properties/values

Example

import { createRenderer } from 'fela'
import validator from 'fela-plugin-validator'

const validatorPlugin = validator({
  logInvalid: true,
  deleteInvalid: true
})

const renderer = createRenderer({
  plugins: [ validatorPlugin ]
})

Example

If the deleteInvalid option is enabled.

Keyframe

Input

{
  '0%': {
    color: 'red'
  },
  '101%': {
    color: 'blue'
  },
  color: 'blue'
}

Output

{
  '0%': {
    color: 'red'
  }
}

Rule

Input

{
  color: 'red',
  ':hover': {
    color: 'green',
    foo: {
      color: 'blue'
    }
  },
  'nested': {
    color: 'yellow'
  }
}

Output

{
  color: 'red',
  ':hover': {
    color: 'green',
  }
}

License

Fela is licensed under the MIT License.
Documentation is licensed under Creative Common License.
Created with ♥ by @rofrischmann and all the great contributors.