Hosting F7 app under certain base url

Hi there!

A question on F7 router config. I have my app’s routes defined as described in the docs like this (with pushstate set to true):

import HomePage from './pages/home.vue'
import SomePage from './pages/some.vue'
import NotFoundPage from './pages/not-found.vue'

export default [
    path: '/',
    component: HomePage,
    path: '/some-page/',
    component: SomePage,
    path: '(.*)',
    component: NotFoundPage,

Everything works fine when the app is hosted in my dev env (under webpack devserver actually), where base url is http://localhost:8080/.

But when I deploy the production bundle to our demo environment then the base url is something like this:
In this case the routes defined above are not working as my route patterns will not match with the ‘/mycoolapp’ part. As a workaround I’ve added aliases with ‘/mycoolapp/’ to the route definitions, but that’s not a real solution, as I don’t have (and shouldn’t have) any effect on the operational environment.

Thanks for any help.


You need to set correct pushStateRoot parameter with the host base

That’s it, thank you!