CODEWITHSUNDEEP
javascriptvue.js
Valor_
Valor_

Reputation: 3591

Parent path is automatically removed from URL in VueJs

I have this weird problem with VueJs2 (cli 3) version, which is that Vue automatically removes parent path from URL.

I have following routes in routes.js file

import Home from "../views/Home";
import Login from "../views/Login";

const router = [

    {
        path: '/wh',
        component: {
            template: '<router-view></router-view>'
        },
        children: [
            {
                path: "/home",
                name: "home",
                component: Home
            },
            {
                path: "/login",
                name: "login",
                component: Login
            },
        ],
    },
];

export default router;

And this is my router.js file

import Vue from "vue";
import Router from "vue-router";
import routes from './routes'

Vue.use(Router);

const router = new Router({
    mode: 'history',
    routes: routes,
    scrollBehavior(to, from, savedPosition) {
        return {x: 0, y: 0}
    }
});

My main.js where I include router

import App from "./App.vue";
import router from "./router/router";
import store from "./store/store";

new Vue({
    store,
    router,
    render: h => h(App)
}).$mount("#app");

And my vue.config.js

module.exports = {
    devServer: {
        proxy: "http://my.app.test"
    },
    outputDir: "public/assets/myApp/app/",
    filenameHashing: true,
    runtimeCompiler: true,
    productionSourceMap: true,
};

The problem is following. /wh is always missing in url param. What ever I click or do I get automatically redirected to login page /wh is missing and my app is working flawlessly. I have already tried to set publicPath: '/wh' in vue.config.js and everything was working same as now. So how to properly configure my routes so I will see /wh in my URL, before other children paths?

If you need any additional information's, please let me know and I will provide. Thank you!

Upvotes: 1

Views: 350

Answers (1)

Alex
Alex

Reputation: 1423

Add in index.html in <head> section <base href="/wh/" />

Upvotes: 2

Related Questions