vue N​​progress のプログレスバー機能を実装する際の一般的な問題

「vue」からVueをインポートします。
「vue-router」から VueRouter をインポートします。
「@/store」からストアをインポートします。
HomeLayout フォームを "@/views/home/layout" としてインポートします。
「nprogress」からNProgressをインポートします。
「./modules/userCenter」からuserCenterをインポートします。
'nprogress/nprogress.css' をインポートします
Vue.use(VueRouter);
NProgress.inc(0.2);
NProgress.configure({easing:'ease',speed:2000,showSpinner:false,trickle:false})
const ルート = [{
	パス："/"、
	名前:"インデックス",
	リダイレクト:"/index"
},{
	パス:"/index",
	名前:'インデックス',
	コンポーネント:()=>import ('@/views/home/index.vue')、
	meta:{title:'ホームページ'}
},{
	パス:'/home',
	名前:'ホーム',
	コンポーネント:()=>import('@/views/home/main'),
	meta:{title:'ホームページ'}
},{
	パス:'/login',
	名前:'ログイン',
	コンポーネント:()=>import ('@/views/login')、
	meta:{title:'ログイン'}
},{
	パス:'/register',
	名前:'登録',
	コンポーネント:()=>import('@/views/register'),
	meta:{title:'登録'}
},{
	パス:'/404',
	名前:'404',
	コンポーネント:()=>import('@/views/errorPage')
},{
	パス：'*'、
	リダイレクト:'/404'
}]
const ルーター = 新しい VueRouter({
	モード: '履歴',
	ルート
})
//ルーティング前にインターセプト router.beforeEach((to,from,next)=>{
	//ページがジャンプする前に、プログレス バーを開始します NProgress.start();
	// いくつかの傍受操作、ログイン権限など...
	const token = window.localStorage.getItem('token'); //localstorageからキャッシュを取得 if(to.meta.title){
		document.title = to.meta.title; //ブラウザタブのタイトルをページのタイトルに変更します
	}
	store.commit('changeCurrentPage',to.path);
	定数reg = /[a-zA-Z]+\/$/;
	//検証を必要としないルートに直接リダイレクトする if(!to.meta.requireAuth){
		if (reg.test(to.path)){
			次は、to.path.replace(reg,'') です。
			戻る;
		}
		次（）;
		戻る
	}
	if(token&&to.name!=='インデックス'){
		// すでにログインしており、リダイレクトされるページはログインページではありません if(reg.test(to.path)){
			次は、to.path.replace(reg,'') です。
			戻る;
		}
		next();//直接ジャンプできます }else if(token && to.name == 'Index'){
		//ログインしていてジャンプしたいページはログインページです if(reg.test(to.path)){
			次は、to.path.replace(reg,'') です。
			戻る
		}
		next('/home');//ホームページに直接ジャンプします }else if(!token && to.name !='Index'){
		//ログインしておらず、ジャンプ先のページがログインページではない next('/index');//ログインページにジャンプ }else{
		if (reg.test(to.path)){
			次は、to.path.replace(reg,'') です。
			戻る;
		}
		次（）
	}
})
ルータ.afterEach(to=>{
	NProgress.done();
	ウィンドウを0,0にスクロールします。
})
//現在のページ メニューの繰り返しクリックを処理し、警告を発行します。const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = 関数push(location){
	元のPush.call(this,location).catch(err=>err) を返します。
}
デフォルトルーターをエクスポートします。

#nprogress .bar {
  背景: #f90 !important; //カスタムカラー}