Vue.js view for Cerebral.
npm install @cerebral/vue vue
import { createApp } from 'vue'
import App from 'cerebral'
import { Container, connect } from '@cerebral/vue'
import main from './main'
import AppComponent from './AppComponent'
const app = App(main)
createApp({
components: {
Container: Container(app),
AppComponent
},
template: '<Container><AppComponent /></Container>'
}).mount('#app')
import { connect } from '@cerebral/vue'
import { state, sequence } from 'cerebral'
export default connect(
{
foo: state`foo`,
click: sequence`clicked`
},
{
template: '<div @click="click">{{foo}}</div>'
}
)
import { createApp } from 'vue'
import App from 'cerebral'
import { Container, connect } from '@cerebral/vue'
import MyComponent from './MyComponent'
import main from './main'
const app = App(main)
createApp({
components: {
Container: Container(app),
'my-component': MyComponent
},
template: '<Container><my-component /></Container>'
}).mount('#app')
For Vue 2, you need to use the complete Vue build that includes the template compiler:
import Vue from 'vue/dist/vue'
import App from 'cerebral'
import { Container, connect } from '@cerebral/vue'
import main from './main'
import AppComponent from './AppComponent'
const app = App(main)
new Vue({
render: (h) =>
h({
components: {
Container: Container(app),
AppComponent: AppComponent
},
template: '<Container><AppComponent /></Container>'
})
}).$mount('#app')
For projects created with vue-cli
, add this to your vue.config.js
:
module.exports = { runtimeCompiler: true }