@iosio/babel-plugin-jcss

custom babel plugin for template string css autoprefixing and minifying

Installation

npm install @iosio/babel-plugin-jcss --save-dev

Usage

Include the following in your babelrc or babel.config.js file

module.exports = {
  "plugins":[
    [
        "@iosio/babel-plugin-jcss",
         {
             "browsers": ["last 2 versions"], //overrides
             "postCssOptions":  {}
         }
     ]
  ]
};

Babel will look for the tag 'jcss' with a tagged string, run the post css and minifying and remove the tag

export const styles = jcss`   
        :host{
            display:flex;
            align-items:center;
            user-select:none;
        }
`;

Results will look something like this

export const styles = `:host{display:flex;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}`;