nuxt 使用iview的loadingbar后报错

Question

如题，我在使用iview的loadingbar之后无法加载loadingbar并且页面显示不出来，下面是代码，加载在plugins/iview.js的文件中

import Vue from 'vue'
import iView from 'view-design'
import 'iview/dist/styles/iview.css'

Vue.use(iView)

export default ({ app }) => {
  app.router.beforeEach((to, from, next) => {
    iView.LoadingBar.start();
    next();
  });

  app.router.afterEach(route => {
    ViewUI.LoadingBar.finish();
  });
}

下面是错误

Answer 1

loadingBar 用到了 document api，这个 api 只有在浏览器上可以使用
https://github.com/iview/ivie...
解决办法？给 iview 提 issue？记得发布 2.0 的时候说过已经支持 ssr 了

我之前写 next.js 的时候用的是 nprogress，这个库是支持 ssr 的

Answer 2

判断浏览器环境再执行
if (process.client) {
xxx
}

Answer 3

if (process.browser) {

判断一下

}