vue3加载条

由于都是懒加载的组件，在切换路由的时候需要加载资源，网速不好会 “静止”，需为了提高用户体验，加上进度条。

pnpm add nprogress
pnpm add @types/nprogress -D

切换路由前开启

NProgress.configure({
  showSpinner: false // 关闭右上角的圈圈
})

//跳转前
router.beforeEach((to) => {
//开启
  NProgress.start()
 
})

//跳转后
router.afterEach((to) => {
//关闭
  NProgress.done()

})

styles/main.scss

//样式怕被覆盖
#nprogress .bar {
    background-color: var(--cp-primary)！important ;
}