Vue Inline Styled

Writing inline CSS style in Vue component with ease.

Use style-to-object under the hood.

Installation

Via npm:

npm install vue-inline-styled

Via Yarn:

yarn add vue-inline-styled

Usage

import Vue from 'vue';
import inlineStyled from 'vue-inline-styled';
 
import MyComponent from './components/MyComponent.vue';
 
const StyledMyComponent = inlineStyled(MyComponent)`
    color: red;
    font-size: 20px;
    background-color: yellow;
`;
 
new Vue({
    el: '#app',
    // Component will be renderred with inline style
    render: h => h(StyledMyComponent)
});