无法让vue-router工作

Question

我可以使用单个页面来实现此功能。这是当我介绍vue-router时，我无法获得任何渲染。

这是我的应用程序。在main.js中 - 如果我用一些示例文本和一些编辑返回App.js - 它呈现正常，没有问题。我觉得它与我如何安装Vue路由器有关。在我的环境中也没有控制台错误。

//main.js

define(function(require) { 
    'use strict'; 
    var Vue = require('vue'); 
    var VueRouter = require('vue-router'); 
    var App = require('app'); 

    var Foo = { template: '<div>oijsdfoijsdoifjdsf</div>' } 
    var Bar = { template: '<div>bar</div>' } 

    Vue.use(VueRouter); 

    var routes = [ 
     { path: '/aaa', component: Foo }, 
     { path: '/bbb', component: Bar } 
    ] 

    var router = new VueRouter({ 
     routes: routes 
    }); 

    return new Vue({ 
     el: '#vue', 
     router: router, 
     render: function(h) { 
      h(App); 
     } 
    }); 
}); 

app.js

define(function(require) { 
    'use strict'; 

    var Vue = require('vue'); 

    return new Vue({ 
     template: '<div id="vue"><router-view></router-view></div>' 
    }); 
}); 

Answer 1

从我的经验，你可以改变你的路由器的配置：

const router = new VueRouter({ 
    base: __dirname, // or '/' 
    routes: routes 
}) 

Answer 2

您还没有定义根路由，例如/。所以你不会在/看到任何组件渲染。你可以导航到/aaa并看到一些东西？另外，不应该将这些路由组件传递给Vue.component？