feat: about & ui

AxyLm · Jul 31, 2022 · 4f8015b · 4f8015b
1 parent 53f8002
commit 4f8015b
Show file tree

Hide file tree

Showing 7 changed files with 4,380 additions and 3,012 deletions.
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -1,32 +1,29 @@
 {
-    // 使用 IntelliSense 了解相关属性。 
-    // 悬停以查看现有属性的描述。
-    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
-    "version": "0.2.0",
-    "configurations": [
-        {
-            "type": "chrome",
-            "request": "launch",
-            "name": "Vue Debug for Chrome",
-            "url": "http://localhost:3000",
-            "webRoot": "${workspaceFolder}/src",
-            "breakOnLoad": true,
-            "sourceMapPathOverrides": {
-                "webpack:///src/*": "${webRoot}/*"
-            }
-        },
-        {
-            "type": "firefox",
-            "request": "launch",
-            "name": "Vue Debug for Firefox",
-            "url": "http://localhost:3000",
-            "webRoot": "${workspaceFolder}/src",
-            "pathMappings": [
-                {
-                    "url": "webpack:///src/",
-                    "path": "${webRoot}/"
-                }
-            ]
-        }
-    ]
-}
+  // 使用 IntelliSense 了解相关属性。
+  // 悬停以查看现有属性的描述。
+  // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Vue Debug for Chrome",
+      "url": "http://localhost:3000",
+      "webRoot": "${workspaceFolder}/src",
+      "breakOnLoad": true,
+      "sourceMapPathOverrides": {
+        "webpack:///src/*": "${webRoot}/*"
+      }
+    },
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Vue Debug for Chrome",
+      "url": "http://localhost:5173",
+      "webRoot": "${workspaceFolder}/src",
+      "sourceMapPathOverrides": {
+        "webpack:///src/*": "${webRoot}/*"
+      }
+    }
+  ]
+}
diff --git a/package.json b/package.json
@@ -34,6 +34,7 @@
   },
   "dependencies": {
     "@typescript-eslint/eslint-plugin": "^5.30.6",
+    "@varlet/ui": "^1.27.18",
     "@vueuse/core": "^8.4.2",
     "eslint": "^8.19.0",
     "eslint-config-prettier": "^8.5.0",

diff --git a/src/layout/Index.vue b/src/layout/Index.vue
@@ -1,12 +1,32 @@
 <template>
   <div class="layout">
     <lHeader></lHeader>
-    <router-view></router-view>
-
+    <div class="p-20 text-center">
+      <img src="/src/assets/logo.svg" class="mb-20 inline w-60" alt="" />
+      <div>
+        <router-view></router-view>
+      </div>
+      <div class="mt-10 text-lg">
+        <router-link to="/home">
+          <span
+            ><sup>{{ str }}</sup> Home</span
+          >
+        </router-link>
+        <router-link to="/about" class="ml-8">
+          <span
+            ><sup class="sub">{{ str }}</sup> Abount</span
+          >
+        </router-link>
+      </div>
+    </div>
     <!-- <Footer></Footer> -->
   </div>
 </template>
-
+<script setup lang="ts">
+  import { useI18n } from 'vue-i18n';
+  const { t } = useI18n();
+  const str = '</>';
+</script>
 <script lang="ts">
   import lHeader from '~/layout/Header.vue';
   import { defineComponent } from 'vue';

diff --git a/src/views/About/index.vue b/src/views/About/index.vue
@@ -1,10 +1,11 @@
 <template>
-  <div class="pt-20 text-center">
+  <div>
     <span class="text-xl">About</span>
+
+    <p class="text-md">孟春之月 - 律之太簇 </p>
+
+    <ul>
+      <!-- <li><a href="https://varlet.gitee.io/varlet-ui/#/zh-CN/home">varlet-ui</a></li> -->
+    </ul>
   </div>
 </template>
-<script lang="ts">
-  export default {
-    name: 'About',
-  };
-</script>
diff --git a/src/views/Home/Index.vue b/src/views/Home/Index.vue
@@ -1,29 +1,19 @@
 <script setup lang="ts">
+  import { ref } from 'vue-demi';
   import { useI18n } from 'vue-i18n';
   const { t } = useI18n();
   const str = '</>';
+
+  const count = ref(0);
 </script>
 
 <template>
-  <div class="p-20 text-center">
-    <img src="/src/assets/logo.svg" class="mb-20 inline w-60" alt="" />
-
-    <div>
-      <span class="fm1 text-5xl">{{ t('helloWorld') }}</span>
-    </div>
-    <div class="mt-10 text-lg">
-      <router-link to="/home">
-        <span
-          ><sup>{{ str }}</sup> Home</span
-        >
-      </router-link>
-      <router-link to="/about" class="ml-8">
-        <span
-          ><sup class="sub">{{ str }}</sup> Abount</span
-        >
-      </router-link>
-    </div>
+  <div>
+    <span class="fm1 text-5xl">{{ t('helloWorld') }}</span>
   </div>
+  <p class="mt-5">
+    <var-button @click="count++">{{ count }} 主要按钮</var-button>
+  </p>
 </template>
 
 <style lang="less">

diff --git a/vite.config.ts b/vite.config.ts
@@ -5,6 +5,7 @@ import * as path from 'path';
 import Icons from 'unplugin-icons/vite';
 import Components from 'unplugin-vue-components/vite';
 import IconsResolver from 'unplugin-icons/resolver';
+import { VarletUIResolver } from 'unplugin-vue-components/resolvers';
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -46,10 +47,9 @@ export default defineConfig({
     Components({
       resolvers: [
         IconsResolver({
-          // to avoid naming conflicts
-          // a prefix can be specified for icons
           prefix: 'icon',
         }),
+        VarletUIResolver(),
       ],
       dts: 'src/components.d.ts',
     }),