render: h => h(App)是什么？

最近在看Vue时，发现在main.js里注册App组件的地方有点不太明白：

如果是按照以前创建Vue实例注册组件的写法，好像应该这么写

import App from './App'
new Vue({
    el: '#app',
    template: '',
    components: {
        App
    }
})

这个render:h=>h(App)是指什么呢？
在网上搜了一下，说两种写法是等效的，但在实际操作中，当我将代码改成上面这种写法后是会报错的，错误如下：

这段话什么意思呢？
就是说你正在使用一个运行版本的Vue，且这个版本的Vue没有可用的模板解析器。要不就使用render处理需要编译的模板，要不就换一个含有模板解析器的版本。

那我们就两条路都看看！

---

第一种：
既然说我们使用的Vue版本缺乏模板解析器，那我们就先看我们用的Vue
（一个小技巧，Ctrl+鼠标左键单击可以直接跳转至引用的文件）

跳转后，我们可以在vue的文件夹里查看package-json，在这里可以看到引用的版本是vue.runtime.esm.js
vue.runtime.xxx.js代表这是运行版的Vue，只包含了核心功能，但是没有模板解析器，所以解析不到我们写的template。

那既然是版本不对，我们就可以通过修改main.js引用的vue版本来解决报错
(不推荐，可以但没必要！！）

import Vue from 'vue/dist/vue.js'

---

第二种：
vue建议我们使用render函数，先看看render，具体可以参考官方文档


实际上我们最后看到的render:h=>h(App)是一种简写，完整版应该是：

进一步简写：

最后改为ES6的箭头函数，就变成了我们现在看到的render:h=>h(App)

至于为什么用h代替createElement，官方文档中是这么写的。