从子目录服务的Vue.js路由

Question

我想从登台服务器上的子目录中提供我的Vue.js应用程序.例如:http://url.com/subdir/app/

现在,如果我这样做并设置构建配置assetsPublicPath从该文件夹提供服务,所有资产都可以正常提供,但我的应用程序无法正确路由."主页"页面被路由到"全部捕获",并且任何其他路由仅显示正常的白页404.

这是我的路由器:

export default new Router({
    mode: 'history',
    routes: [
    {
        path: '/',
        component: ContentView,
        children: [
            {
                path: '/',
                name: 'DataTable',
                component: DataTable,
                meta: { requiresAuth: true }
            },

            // ===================================
            //  Login
            // ===================================
            {
                path: '/login',
                name: 'AppLogin',
                component: AppLogin,
                meta: { checkAlreadyLoggedIn: true }
            },
            {
                path: '/logout',
                name: 'AppLogout',
                component: AppLogout,
                meta: { requiresAuth: true }
            }
        ]
    },
    {
        path: '*',
        component: ContentView,
        children: [
            {
                path: '/',
                name: 'NotFound',
                component: NotFound
            }
        ]
    }
]})

这是必要的config/index.js更改: assetsPublicPath: '/subdir/app/'

在当地发展中,路线运作良好.但是在登台服务器上所有静态资产,内置的JS和CSS等都可以正常运行.然而,本土路线显示了全部.我假设它是因为我的路由设置不正确,或者因为我需要做一些事情从生产中的子目录服务.

Answer 1

该assetsPublicPath配置只是为的WebPack资产.对于vue-router,您需要base在构造函数中设置该选项.

请参阅docs:https://router.vuejs.org/en/api/options.html#base