It was extracted from inline-style-prefixer. Check that repository for detailed information on which properties are supported, which special plugins are used and other stuff.
You could also use inline-style-prefixer completely as it uses prefix-all as a fallback, but this repository has reduced file size.
It will only add prefixes if a property still needs them in one of the following browser versions.
This means e.g.
border-radius will not be prefixed at all.
For legacy support check custom build.
- Chrome: 30+
- Safari: 6+
- Firefox: 25+
- Opera: 13+
- IE: 9+
- Edge 12+
- iOS: 6+
- Android: 4+
- IE mobile: 9+
- Opera mini: 5+
- Android UC: 9+
- Android Chrome: 30+
npm install inline-style-prefix-all --save
const styles =transition: '200ms all linear'boxSizing: 'border-box'display: 'flex'color: 'blue'const prefixedStyles =// prefixedStyles === outputconst output =WebkitTransition: '200ms all linear'// Firefox dropped prefixed transition with version 16// IE never supported prefixed transitionstransition: '200ms all linear'MozBoxSizing: 'border-box'// Firefox up to version 28 needs a prefix// Others dropped prefixes out of scopeboxSizing: 'border-box'// Fallback/prefixed values get grouped in arraysdisplay: '-webkit-box' '-moz-box' '-ms-flexbox' '-webkit-flex' 'flex'color: 'blue'
Custom Build & Legacy Support
You may have to create a custom build if you need older browser versions. Just modify the config.js file which includes all the browser version specifications.
npm installnpm run build
I would love to see people getting involved.
If you have a feature request please create an issue. Also if you're even improving inline-style-prefix-all by any kind please don't be shy and send a pull request to let everyone benefit.
If you're having any issue please let me know as fast as possible to find a solution a hopefully fix the issue. Try to add as much information as possible such as your environment, exact case, the line of actions to reproduce the issue.
If you are creating a pull request, try to use commit messages that are self-explanatory. Also always add some tests unless it's totally senseless (add a reason why it's senseless) and test your code before you commit so Travis won't throw errors.