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,
});

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

1 个答案: