SCRIPT438：SCRIPT438：对象不支持属性或方法"组件"

Question

我们正在尝试使用Laravel+vue+bootstrap构建一个SPA应用程序。

我们确实遵循了这篇文章：https://laravel-news.com/using-vue-router-laravel

但任何组件都没有加载，在控制台中我们有一个错误：

SCRIPT438: SCRIPT438: Object doesn't support property or method 'component'

app.js文件：

require('./bootstrap');
window.Vue = require('vue');
window.Vue = require('vue-router');
Vue.component('example-component', require('./components/ExampleComponent.vue'));
Vue.component('application-component', require('./components/Application.vue'));
Vue.component('about-us-component', require('./components/About-US.vue'));
Vue.component('contact-us-component', require('./components/Contact-US.vue'));
const router = new VueRouter({
mode: 'history',
routes: [
{
path: '/',
name: 'application',
component: Application
},
{
path: '/about-us',
name: 'about-us',
component: About-Us
},
{
path: '/contact-us',
name: 'contact-us',
component: Contact-Us
},
],
});
const app = new Vue({
el: '#app',
components: { Application },
router,
});

问题在哪里？我们如何解决？

Answer 1

我希望这能与一起工作

var bootstrap = require('./bootstrap');
var Vue = require('vue');
var VueRouter = require('vue-router');
Vue.use(bootstrap);
var ExampleComponent = require('./components/ExampleComponent.vue');
var ApplicationComponent = require('./components/Application.vue');
var AboutUsComponent = require('./components/About-US.vue');
var ContactUsComponent = require('./components/Contact-US.vue');
const router = new VueRouter({
mode: 'history',
routes: [
{
path: '/',
name: 'application',
component: ApplicationComponent
},
{
path: '/about-us',
name: 'about-us',
component: AboutUsComponent
},
{
path: '/contact-us',
name: 'contact-us',
component: ContactUsComponent
},
],
});
const app = new Vue({
el: '#app',
components: { Application },
router,
});