加载进度（开启进度条----结束进度条）

由于都是懒加载的组件，在切换路由的时候需要加载资源，网速不好会 “静止”需要等加载完路由对应组件资源，才会渲染页面结构，为了提高用户体验，加上进度条

安装插件

pnpm add nprogress
pnpm add @types/nprogress -D

引入到路由组件

import NProgress from ‘nprogress’
import ‘nprogress/nprogress.css’

可以关闭进度条右边的圈圈，根据自己项目需求

NProgress.configure({
showSpinner: false
})

切换路由前开启

router.beforeEach((to) => {
//开启金进度条
NProgress.start()
}

路由切换完毕后关闭

router.afterEach((to) => {
//关闭进度条
NProgress.done()
})