VUE JS Router - allow dot in router param

I face an issue with allowing my router param have values with . (dot).

For example, I have the following route setup:

{
  path: '/name/:name/city/:city',
  name: 'home',
  component: Home
}

In some cases, the value of the city can be: boston - /name/joe/city/boston.

Some other cases can be: new.york - /name/joe/city/new.york

The boston page will load, while the new.york page will fail on 404 not found.

Like the route refuses to deal with the . (dot).

The issue occurs only when reloading the page, and not while navigating between pages of the website itself.

On the client side, I tried upgrading the vue-router version to 3.5.3.

The vuejs router is set with: new VueRouter({mode: 'history', routes});

On the server side, I tried using connect-history-api-fallback npm:

const history = require('connect-history-api-fallback');
app.use(history());

and also with:

app.use(history({disableDotRule: true}));

The issue does not reproduce locally, therefore I suspect it is caused by the .htaccess config.

I could not find a clear solution online and would appreciate a direction to solve the issue and allow route params with dots.

Thanks!