https://github.com/lostcrew/vue-styletron

Styletron for Vue.js
https://github.com/lostcrew/vue-styletron

css-in-js javascript plugin styletron styletronjs vue vuejs

Last synced: 2 months ago
JSON representation

Styletron for Vue.js

• Host: GitHub
• URL: https://github.com/lostcrew/vue-styletron
• Owner: LostCrew
• License: mit
• Created: 2017-06-13T22:52:34.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-06-14T22:37:42.000Z (over 7 years ago)
• Last Synced: 2024-09-15T04:42:12.773Z (4 months ago)
• Topics: css-in-js, javascript, plugin, styletron, styletronjs, vue, vuejs
• Language: JavaScript
• Size: 32.2 KB
• Stars: 9
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue-styletron

[![Travis](https://img.shields.io/travis/LostCrew/vue-styletron.svg)](Build)

[![David](https://img.shields.io/david/LostCrew/vue-styletron.svg)](dependencies)

[![David](https://img.shields.io/david/dev/LostCrew/vue-styletron.svg)](DevDependencies)

[![npm](https://img.shields.io/npm/l/vue-styletron.svg)](License)

> [Styletron](https://github.com/rtsao/styletron) for [Vue.js](https://github.com/vuejs/vue)

## Install

#### Add dependency

`npm install vue-styletron --save` or `yarn add vue-styletron`

#### Initialize plugin

```js

import VueStyletron from 'vue-styletron'

Vue.use(VueStyletron)

```

## Usage

#### Define `style` in data, use `v-style` in template

```js

new Vue({

  el: '#el',

  data: {

    style: {

      el: {

        color: 'white'

      }

    }

  }

  template: '
White text
'

})


// Styletron generated style:

// .a {

//   color: white

// }

// Vue rendered template:

// 
White text

```