jss-plugin-vendor-prefixer

What is jss-plugin-vendor-prefixer?

The jss-plugin-vendor-prefixer is a plugin for JSS (JavaScript Style Sheets) that automatically adds vendor prefixes to CSS properties, ensuring compatibility across different browsers.

What are jss-plugin-vendor-prefixer's main functionalities?

Automatic Vendor Prefixing

This feature automatically adds vendor prefixes to CSS properties. In the example, the 'display' and 'userSelect' properties will be prefixed as needed for different browsers.

const jss = require('jss').default;
const preset = require('jss-preset-default').default;
const vendorPrefixer = require('jss-plugin-vendor-prefixer').default;

jss.setup(preset());
jss.use(vendorPrefixer());

const styles = {
  button: {
    display: 'flex',
    userSelect: 'none'
  }
};

const { classes } = jss.createStyleSheet(styles).attach();
console.log(classes.button);

Other packages similar to jss-plugin-vendor-prefixer

autoprefixer

Autoprefixer is a PostCSS plugin that parses your CSS and adds vendor prefixes to CSS rules using values from the Can I Use website. It is more comprehensive and widely used compared to jss-plugin-vendor-prefixer, but it requires a PostCSS setup.

styletron-engine-atomic

Styletron is a toolkit for component-oriented styling. The styletron-engine-atomic package includes automatic vendor prefixing as part of its functionality. It is similar to jss-plugin-vendor-prefixer but is part of the Styletron ecosystem, which is focused on atomic CSS.

emotion

Emotion is a library designed for writing CSS styles with JavaScript. It includes automatic vendor prefixing as part of its core functionality. Emotion is more feature-rich and offers a broader range of styling capabilities compared to jss-plugin-vendor-prefixer.

README

jss-plugin-vendor-prefixer

JSS plugin that handles vendor prefixes in the browser

See our website jss-plugin-vendor-prefixer for more information.

Install

Using npm:

npm install jss-plugin-vendor-prefixer

or using yarn:

yarn add jss-plugin-vendor-prefixer

Changelog

10.0.0-alpha.10 (2019-2-9)

Improvements

• [jss] Simplify cloneStyle function (#1003)
• [jss] Use WeakMap inside SheetsManager (#1019)
• [internal] Improve publish script for creating github release (#999)
• [react-jss] Warn about themed styles misuse (#1006)

Bug fixes

• [jss-starter-kit] Fix react-jss exports and add missing jss exports (#1001)
• [jss-plugin-camel-case] Fix hyphenating css variables (#1017)