vue项目中使用JSX

这里主要是使用：

babel-plugin-transform-vue-jsx

github地址： https://github.com/vuejs/babel-plugin-transform-vue-jsx

目前状态：

（1）针对于vue2.0 的项目
（2）Babel 6，Babel 7都可以使用

使用方式

（1）安装：

npm install babel-plugin-syntax-jsx babel-plugin-transform-vue-jsx babel-helper-vue-jsx-merge-props babel-preset-env --save-dev

（2）配置.babelrc

{
     
  "presets": ["env"],
  "plugins": ["transform-vue-jsx"]
}

(3)举例说明

HTML

<div id="foo">{
     this.text}</div>

JS

h('div', {
     
  attrs: {
     id: 'foo'}
}, [this.text])

这样我们就可以愉快的使用 jsx 写render function了