Vuexy Admin loader for inital page load
Vuexy Admin loader用于初始页面加载

Why App Loader? 为什么需要App Loader?

If user visits your app and your app is too large then it takes some time to load whole app, during this time users sees blank white screen. This shows poor UX. That’s why Vuexy Admin have app-loader to show loading/initialization of app when user visits your app.
如果用户访问您的应用程序并且您的应用程序太大,则需要花费一些时间来加载整个应用程序,在此期间,用户会看到空白的白屏。 这表明用户体验不好。 这就是为什么Vuexy Admin允许应用程序加载器在用户访问您的应用程序时显示应用程序的加载/初始化。

Where It’s Placed? 在哪里?

You can find app-loader in public/ folder of your project. index.html file in that folder imports loader.css and logo.png for showing app-loader to users.
您可以在项目的public /文件夹中找到应用程序加载器。 该文件夹中的index.html文件导入loader.css和logo.png,以向用户显示应用程序加载器。

TIP Vuexy Admin uses loader made from pure css. It is not from Vuesax Component Framework. Vuexy Admin使用纯CSS制作的加载程序。 它不是来自Vuesax Component Framework。

How to remove app-loader? 怎么去掉它?

You can remove app-loader by removing following lines from index.html
您可以通过从index.html中删除以下行来删除

  1. ...
  2. <link rel="stylesheet" type="text/css" href="/loader.css">
  3. ....
  4. ....
  5. <div id="loading-bg">
  6. <div class="loading-logo">
  7. <img src="<%= BASE_URL %>logo.png" alt="Logo">
  8. </div>
  9. <div class="loading">
  10. <div class="effect-1 effects"></div>
  11. <div class="effect-2 effects"></div>
  12. <div class="effect-3 effects"></div>
  13. </div>
  14. </div>
  15. ...

Now, you have successfully removed app loader from index.html, but to completely wipe out app-loader from your app, go to router.js file and remove these lines:
现在,您已经成功地从index.html中删除了App Loader,但是要完全清除应用程序中的App Loader,请转到router.js文件并删除以下几行:

router.afterEach(() => {
  // Remove initial loading
  const appLoading = document.getElementById('loading-bg')
    if (appLoading) {
        appLoading.style.display = "none";
    }
})