压缩所有静态资源及添加loading，页面默认隐藏

src/components/TestPanel.vue

@@ -239,6 +239,11 @@ export default {
         })
       })
     },
+    // 关闭父页面的loading，并置加载完成状态为true
+    closeLoad() {
+      this.$parent.loadIns.close()
+      this.$parent.loaded = true
+    },
     // 获取考核列表来查询该考核是否已经考过
     getAssList(){
       this.$post(`${this.api.pageStuAssessment}`, {
@@ -268,6 +273,8 @@ export default {
           this.statusTimer = setInterval(_ => {
             this.getStatus()
           }, 1000)
+        } else {
+          this.closeLoad()
         }
       }).catch(res => {})
     },
@@ -283,6 +290,7 @@ export default {
         projectId, // 项目id，同上
         cid // 课程id
       }).then(res => {
+        this.closeLoad()
         const code = res.getLastCache
         // 如果有缓存代码，再提示用户是否要继续上次的实验
         if (code) {

src/views/Home.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div v-show="loaded">
     <div class="header" :class="{hh: $config.isHh}">
       <img v-if="$config.isHh" src="@/assets/images/logo-hh.png" alt="" class="logo">
       <p v-else>{{$config.title}}</p>
@@ -48,9 +48,12 @@
 import testPanel from "../components/TestPanel";
 import codemirror from "../components/codemirror";
 import util from '@/util'
+import { Loading } from 'element-ui'
 export default {
   data() {
     return {
+      loaded: false, // 页面是否加载完的标识，页面默认隐藏，一进来先显示加载条，接口加载完后再显示页面，不然一开始会一闪而过没有样式的页面
+      loadIns: null, // loading实例
       courseId: util.getCookie("courseId"), // 课程id
       assessmentId: util.getCookie("assessmentId"), // 考核id
       systemId: util.getCookie('systemId'),
@@ -66,6 +69,9 @@ export default {
     testPanel
   },
   mounted() {
+    this.loadIns = Loading.service({
+      background: 'rgba(255, 255, 255, .1)'
+    })
     this.autoLogout()
     // 绑定页面离开监听
     window.onbeforeunload = () => {
@@ -132,6 +138,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+[v-cloak] {
+  display: none;
+}
 .header {
   display: flex;
   justify-content: space-between;