How to remove the hash "#" symbol from url?

Question

The website that I'm editing right now, every link at switching pages has hash symbol. And the page doesn't refresh everytime I switch and sticks on the last position of the site.

Where can I find the code and remove the hash from the url. Does removing it will make the pages refresh everytime?

Answer 1

Vue is a Single Page Application framework. That means you don't have full page loads, instead page content is swapped out dynamically on the client.

Assuming you're using vue router , you can switch to historyMode which won't use # for urls and instead real urls.

From the docs :

The default mode for vue-router is hash mode - it uses the URL hash to simulate a full URL so that the page won't be reloaded when the URL changes.

To get rid of the hash, we can use the router's history mode, which leverages the history.pushState API to achieve URL navigation without a page reload:

const router = new VueRouter({ mode: 'history', routes: [...] })

This will get you "normal" urls as seen anywhere else on the web.