vue如何从url中删除/#/

Question

我正在 vue 中工作，当查看页面时，链接显示如下：

http://localhost:8080/#/

http://localhost:8080/#/categorias

我该如何删除它？

所以它看起来像这样？

http://localhost:8080/categorias
http://localhost:8080/

这是我的 js 路由器

import { createRouter, createWebHashHistory } from 'vue-router'
//import Home from '../views/Home.vue'
import Inicio from '../components/Inicio.vue'
const routes = [
  {
    path: '/',
    name: 'inicio',
    component: Inicio
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  },
  {
    path: '/categorias',
    name: 'Categorias',

    component: () => import(/* webpackChunkName: "about" */ '../components/Categorias.vue')
  },
  {
    path: '/login',
    name: 'Login',

    component: () => import(/* webpackChunkName: "about" */ '../components/Login.vue')
  }

]


const router = createRouter({
  history: createWebHashHistory(),
  routes
})

export default router

我感谢任何帮助，谢谢，因为我无法解决它，并且以这种方式拥有该网址感到不舒服：D

Answer 1

使用createWebHistory（HTML5模式）代替createWebHashHistory（哈希模式）

import { createRouter, createWebHistory } from 'vue-router'
...
const router = createRouter({
  history: createWebHistory(),
  routes
})