babel-plugin-css-to-inline-styles

Convert your css class to inline styles

Usage no npm install needed!

<script type="module">
  import babelPluginCssToInlineStyles from 'https://cdn.skypack.dev/babel-plugin-css-to-inline-styles';
</script>

README

babel-plugin-css-to-inline-styles

Installation

npm install --save babel-plugin-css-to-inline-styles

Example

Given an example css file (test.css)

.main-wrapper {
    flex-direction: row;
    display: flex;
    flex: 1;
  }

app.jsx


const ReactComponent = <div className="main-wrapper"></div>

transforms to


const ReactComponent = <div style={{
                                    flexDirection: 'row',
                                    display: 'flex',
                                    flex: 1;
                                    }}>
                        </div>

Need help or want to donate to help me make Open Source projects?