nprogress在路由中使用

import { createRouter, createWebHashHistory } from 'vue-router'
import { routes } from './routes.js'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
NProgress.inc(0.2)
NProgress.configure({ easing: 'ease', speed: 500, showSpinner: true })
const router = createRouter({
  history: createWebHashHistory(),
  routes,
  //滚动行为
  scrollBehavior() {
    return {
      left: 0,
      top: 0,
    }
  },
})
// 页面路由刚开始切换的时候
router.beforeEach(async (to, from, next) => {
  // 开启进度条
  NProgress.start()
  next()
})
 
// 页面路由切换完毕的时候
router.afterEach(() => {
  // 关闭进度条
  NProgress.done()
})
 
export default router