javascript - routers/index.js を使用するように VUE の main.js を変更する方法

Question

CLI/3 によって生成された VUE UI の main.js コードが古い構文と異なるのはなぜですか?その部分は何ですか?どのように機能しますか?

sync(store, router) // for vuex-router-sync
new Vue({
  router, 
  store, 
  render: h => h(App)
}).$mount('#app')

以前は

sync(store, router) // for vuex-router-sync

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,
  template: '<App/>',
  components: { App }
})

また、vuex-router-sync を使用せずにルーターを使用するための 3 番目の構文についても読みましたVue.extend(... 。new Vue(

なぜ今レンダリングを追加しなければならないのか、h 関数は何を置き換えているのか、なぜその文字が選択されたのか、$mount 構文は何を行って置き換えているのか、なぜ $mount 構文が選択されたのか?

また、これが別のトピックでない場合: 新しい構文は実際に何Vue.extend()をするVue.extend()のnew Vue()でしょうか?