無法讓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？