Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Plugin use cases: autoprefix, minify etc. #8

Open
codepunkt opened this issue Jan 26, 2017 · 1 comment
Open

Plugin use cases: autoprefix, minify etc. #8

codepunkt opened this issue Jan 26, 2017 · 1 comment

Comments

@codepunkt
Copy link
Owner

codepunkt commented Jan 26, 2017

for style prefixing, inline-style-prefixer could be used. could also use cssnano (thanks @oliverturner for the idea) and autoprefixer postcss plugins - especially when performed at build time as opposed to runtime (needs babel/webpack plugins first)

@codepunkt
Copy link
Owner Author

codepunkt commented Jan 27, 2017

@rofrischmann's inline-style-prefixer is around 8.5kb and 2.5kb when used in static mode. i'd rather not have this included, but it might be added as a plugin. A quick idea:

plugin

import Prefixer from 'inline-style-prefixer'

export default (properties, options) => {
  const prefixer = new Prefixer(options)
  return prefixer.prefix(properties)
}

usage

import spring from 'css-spring'
import prefix from 'css-spring-prefixer'

const keyframes = spring(
  { transform: '0deg' },
  { transform: '15deg' },
  { plugins: [ prefix ]},
)

After calculation of keyframes, plugins could be applied in the order they are defined - like this:

plugins.forEach((plugin) => {
  const method = plugin.method || plugin
  const options = plugin.options || {}

  Object.keys(keyframes).forEach((percent) => {
    keyframes[percent] = method(keyframes[percent], options)
  })
})

@codepunkt codepunkt self-assigned this Jan 28, 2017
@codepunkt codepunkt changed the title Auto-prefix Plugin use cases: autoprefix, minify etc. Feb 8, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant