react-to-vue

在逛github时，发现一个项目中的某个组件写的特别好，想引进我们的项目。
但是我们的项目是vue，这个组件是用react写的，也不想重新写一遍，可以使用react-to-vue工具来进行转译。

react-to-vue

转换的效果真的很好

npm install react-to-vue -g

Usage: rtv [options] file(react component)
Options:
 
  -V, --version         output the version number
  -o --output [string]  the output file name
  -t --ts               it is a typescript component
  -f --flow             it is a component with Flow type annotations
  -h, --help            output usage information
 

vue-jsx

react-to-vue能把react代码转成vue代码，但是转成的代码依旧是jsx代码，如果webpack没有配置解析jsx的话，需要配置一下

npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props

webpack增加该babel的预设（因为我使用的是vue-cli，里边应该是已经预设了jsx的解析，所以我没加，但是还是记录一下）

presets: [
 '@vue/cli-plugin-babel/preset',
 ['@vue/babel-preset-jsx',
  {
  'injectH': false
  }]
 ]

vue-jsx的调用与普通的.vue文件是一样的，目前该组件已经在项目中使用