Vue js;Vue router is not constructor error in simple route

Vue js;Vue router is not constructor error in simple route

我正在尝试用官方路由库实现简单的路由

这是我的app.js

 window.Vue = require('vue');
    window.VueRouter= require('vue-router');

    Vue.use(VueRouter);

const vt=Vue.component('example', require('./components/Example.vue'));

const router = new VueRouter({
      routes:[
        {
          path:'/test',
          component:vt
        }
    ]
})

const app = new Vue({
    el: '#app',
    router:router
});

但是我得到一个错误

app.js:11256 Uncaught TypeError: VueRouter is not a constructor

根据评论,我终于解决了这个导入问题

import VueRouter from 'vue-router';
Vue.use(VueRouter);

此答案适用于希望对问题有更多了解的任何旁观者。

这里有两种解决方法。

方案一:ES模块导入

在Laravel的默认配置中[至少],vue-router预计将作为es模块导入。所以,它应该在文件的顶部完成。

import VueRouter from 'vue-router'

解决方案 2:CommonJS 要求

由于 vue-router 路由器 一个 es 模块,您将必须显式访问 CommonJS 版本的 default 属性模块。

const VueRouter = require('vue-router').default;

任一解决方案

您必须在 Vue 中注册 Vue Router。

Vue.use(VueRouter)