From e7708db6d9238b827dc50dab9ad51810841c5568 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=82=B9=E6=99=AF=E7=AB=8B?= <zoujingli@qq.com>
Date: Wed, 24 Nov 2021 22:45:36 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=90=8E=E9=9D=A2=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html                 | 42 ++++----------------------------------
 static/app.less            | 37 +++++++++++++++++++++++++++++++++
 static/template/layout.vue |  4 ++--
 3 files changed, 43 insertions(+), 40 deletions(-)
 create mode 100644 static/app.less

diff --git a/index.html b/index.html
index 4391bcc14..e149fce4a 100644
--- a/index.html
+++ b/index.html
@@ -6,51 +6,17 @@
     <title>Layout Demo - 这是一个技术实践分支，仅用于测试使用</title>
 
     <!-- 加载框架样式 -->
-    <link rel="stylesheet" href="./static/plugs/core/vue.element.plus.css"/>
+    <link rel="stylesheet" href="static/plugs/core/vue.element.plus.css">
 
-    <style type="text/less">
-      html, body, #app {
-        height: 100%;
-        display: block;
-        margin: 0;
-        padding: 0;
-      }
-
-      #app > .el-container {
-        height: 100%;
-
-        > .el-header {
-          color: #fff;
-          background: #0d84ff;
-          line-height: 60px;
-        }
-
-        > .el-container {
-          > .el-aside {
-            background: #53a8ff;
-          }
-
-          > .el-container {
-            > .el-main {
-              background: gray;
-            }
-
-            > .el-footer {
-              color: #fff;
-              background: #333;
-              line-height: 60px;
-            }
-          }
-        }
-      }
-    </style>
 
     <!-- 加载基础框架组件 -->
     <script src="static/plugs/core/vue.min.js"></script>
     <script src="static/plugs/core/vue.router.js"></script>
     <script src="static/plugs/core/vue.sfc.loader.js"></script>
     <script src="static/plugs/core/vue.element.plus.js"></script>
-    <script src="static/plugs/less/less.min.js"></script>
+    <script src="static/plugs/less/less.min.js" async></script>
+    
+    <link rel="stylesheet/less" href="static/app.less">
 
     <!-- 加载基础框架模块 -->
     <script type="module" src="static/app.js"></script>
diff --git a/static/app.less b/static/app.less
new file mode 100644
index 000000000..6a0f93adf
--- /dev/null
+++ b/static/app.less
@@ -0,0 +1,37 @@
+html, body, #app {
+  height: 100%;
+  display: block;
+  margin: 0;
+  padding: 0;
+}
+
+#app > .el-container {
+  height: 100%;
+
+  > .el-header {
+    color: #fff;
+    background: #0d84ff;
+    line-height: 60px;
+  }
+
+  > .el-container {
+
+    > .el-aside {
+      background: #53a8ff;
+    }
+
+    > .el-container {
+
+      > .el-main {
+        background: gray;
+      }
+
+      > .el-footer {
+        color: #fff;
+        background: #333;
+        line-height: 60px;
+      }
+
+    }
+  }
+}
\ No newline at end of file
diff --git a/static/template/layout.vue b/static/template/layout.vue
index 1c6161533..06f4bfef9 100644
--- a/static/template/layout.vue
+++ b/static/template/layout.vue
@@ -13,8 +13,8 @@
   </el-container>
 </template>
 
-<script>
 
+<script>
 export default {
   name: "layout",
   components: {},
@@ -25,4 +25,4 @@ export default {
   },
   methods: {}
 }
-</script>
\ No newline at end of file
+</script>