vue-router：無法解析異步組件呈現

Question

我是vue-router的初學者，我不能讓它工作。 當我啟動我的應用程序時，我收到以下錯誤：

[vue-router] Failed to resolve async component render: TypeError: _vm is undefined
49:16:39
[vue-router] uncaught error during route navigation:
49:16:39
TypeError: _vm is undefined
Stack trace:
render@webpack-internal:///63:3:7
resolveAsyncComponents/</<@webpack-internal:///49:1774:17
flatMapComponents/</<@webpack-internal:///49:1801:66
...

這是我的文件：main.js

import Vue from 'vue'
import App from './App.vue'
import router from './routes.js'
import 'bootstrap'

new Vue({
  el: '#app',
  router,
  render: h => h(App)
})

routes.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from './Home.vue'

export const routes = [
  { name: 'Home', path: '', components: Home }
]

Vue.use(VueRouter)

const router = new VueRouter({
  routes
})

export default router

Answer 1

routes存在拼寫錯誤，將組件更改為組件：

export const routes = [
  { name: 'Home', path: '', component: Home }
]