babel-preset-vue

Babel preset for all Vue plugins.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
babel-preset-vue
8592.0.25 years ago6 years agoMinified + gzip package size for babel-preset-vue in KB

Readme

babel-preset-vue
Babel preset for all Vue plugins.

Install

npm install -D babel-preset-vue

CDN: UNPKG

Usage

In your .babelrc:
{
  "presets": ["vue"]
}

You can toggle specific features, by default all features are enabled, e.g.:
{
  "presets": [
    ["vue", {
      "eventModifiers": false
    }]
  ]
}

JSX Features

Note that following features are not available for babel v7 currently, you may disable them if necessary.

Event modifiers

Option name: eventModifiers
Uses babel-plugin-jsx-event-modifier for adding event modifiers support.
Example:
Vue.component('hello-world', {
  methods: {
    method () {
      console.log('clicked')
    }
  },
  render () {
    return (
      <div>
        <a href="/" onClick:prevent={this.method} />
      </div>
    )
  }
})

v-model

Options name: vModel
Uses babel-plugin-jsx-v-model for adding v-model support.
Example:
Vue.component('hello-world', {
  data: () => ({
    text: 'Hello World!'
  }),
  render () {
    return (
      <div>
        <input type="text" v-model={this.text} />
        {this.text}
      </div>
    )
  }
})

License

MIT © EGOIST