Skip to content

Instantly share code, notes, and snippets.

@njleonzhang njleonzhang/index.js
Last active Aug 21, 2018

Embed
What would you like to do?
Vue jsx transform sample
const Babel = require('babel-core')
const vueJsx = require('babel-plugin-transform-vue-jsx')
let code = `
function render() {
return (
<div>
<div leon={a} onClick={this.click()}
{...{
props: {
prop1: 1,
prop2: 2
},
on: {
event: this.handleEvent()
}
}}
>
</div>
</div>
)
}`
let result = Babel.transform(code, {
plugins: [
vueJsx,
]
})
console.log(result.code)
{
"devDependencies": {
"babel-core": "^6.26.3",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-vue-jsx": "^3.7.0",
"babel-preset-env": "^1.7.0"
}
}
// node index.js , then we get:
import _mergeJSXProps from "babel-helper-vue-jsx-merge-props";
function render() {
return h("div", [h("div", _mergeJSXProps([{
attrs: { leon: a },
on: {
"click": this.click()
}
}, {
props,
on: {
event: this.handleEvent()
}
}]))]);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.