Vue NProgress page loading progress bar July 16, 2020

import App from './App'
import VueRouter from 'vue-router'
import router from './router' // Your routing file
/ / introduce nprogress
import NProgress from 'nprogress'
import 'nprogress/nprogress.css' // This style must be introduced

Vue.use(VueRouter)

// Simple configuration
NProgress.inc(0.2)
NProgress.configure({ easing: 'ease'.speed: 500.showSpinner: false })


router.beforeEach((to,from,next) = > {
  NProgress.start()
  next()
})

router.afterEach(() = > {
  NProgress.done()
})


new Vue({
  el: '#app',
  router,
  render: h= > h(App)
})
Copy the code