vue-class-component playground

by ktsn

HTML

<div id="app"></div>



<!-- Importing libs and setup -->
<script src="https://unpkg.com/vue@latest/dist/vue.js"></script>
<script src="https://unpkg.com/vue-class-component@latest/dist/vue-class-component.js"></script>
<script>
var s = document.querySelector('script[type="text/jsx"]')
s.setAttribute('data-presets', 'es2017')
s.setAttribute('data-plugins', 'transform-decorators-legacy,transform-class-properties')
</script>

Babel + JSX

const { default: Component, createDecorator } = VueClassComponent

@Component({
  template: `
    <h1>{{ message }}</h1>
  `
})
class App extends Vue {
  message = 'Hello!'
}

new Vue({
  el: '#app',
  render: h => h(App)
})