fix(main): 🐛 增加 reset/tailwind 样式文件

package.json

@@ -28,6 +28,7 @@
   },
   "dependencies": {
     "@types/lodash-es": "^4.17.12",
+    "@unocss/reset": "^0.58.5",
     "@vicons/antd": "^0.12.0",
     "@vicons/ionicons5": "^0.12.0",
     "@vicons/utils": "^0.1.4",
@@ -53,10 +54,10 @@
     "@types/qs": "^6.9.11",
     "@typescript-eslint/eslint-plugin": "^6.16.0",
     "@typescript-eslint/parser": "^6.16.0",
-    "@vitejs/plugin-vue": "^5.0.0",
-    "@vue/eslint-config-typescript": "^12.0.0",
     "@unocss/transformer-directives": "^0.58.4",
     "@unocss/transformer-variant-group": "^0.58.4",
+    "@vitejs/plugin-vue": "^5.0.0",
+    "@vue/eslint-config-typescript": "^12.0.0",
     "autoprefixer": "^10.4.16",
     "cross-env": "^7.0.3",
     "cz-git": "^1.8.0",

pnpm-lock.yaml

@@ -8,6 +8,9 @@ dependencies:
   '@types/lodash-es':
     specifier: ^4.17.12
     version: 4.17.12
+  '@unocss/reset':
+    specifier: ^0.58.5
+    version: 0.58.5
   '@vicons/antd':
     specifier: ^0.12.0
     version: 0.12.0
@@ -79,9 +82,6 @@ devDependencies:
   '@typescript-eslint/parser':
     specifier: ^6.16.0
     version: 6.16.0(eslint@8.56.0)(typescript@5.3.3)
-  '@unocss/preset-rem-to-px':
-    specifier: ^0.58.4
-    version: 0.58.5
   '@unocss/transformer-directives':
     specifier: ^0.58.4
     version: 0.58.5
@@ -1750,12 +1750,6 @@ packages:
       '@unocss/rule-utils': 0.58.5
     dev: true
 
-  /@unocss/preset-rem-to-px@0.58.5:
-    resolution: {integrity: sha512-gM1jy/HoUS/HeiuOt5u+fAAWT/PPLqfC8eWGRrtqm22zKOq0Ea/Lp8Jh+BApc1cGby2xw6lwiFJRbFbiPaFoNw==}
-    dependencies:
-      '@unocss/core': 0.58.5
-    dev: true
-
   /@unocss/preset-tagify@0.58.5:
     resolution: {integrity: sha512-UB9IXi8vA/SzmmRLMWR7bzeBpxpiRo7y9xk3ruvDddYlsyiwIeDIMwG23YtcA6q41FDQvkrmvTxUEH9LFlv6aA==}
     dependencies:
@@ -1795,7 +1789,6 @@ packages:
 
   /@unocss/reset@0.58.5:
     resolution: {integrity: sha512-2wMrkCj3SSb5hrx9TKs5jZa34QIRkHv9FotbJutAPo7o8hx+XXn56ogzdoUrcFPJZJUx2R2nyOVbSlGMIjtFtw==}
-    dev: true
 
   /@unocss/rule-utils@0.58.5:
     resolution: {integrity: sha512-w0sGJoeUGwMWLVFLEE9PDiv/fQcQqZnTIIQLYNCjTdqXDRlwTp9ACW0h47x/hAAIXdOtEOOBuTfjGD79GznUmA==}

src/main.ts

@@ -1,6 +1,9 @@
 import 'virtual:uno.css';
 import 'vant/es/toast/style';
 import 'vant/es/dialog/style';
+import '@unocss/reset/tailwind.css';
+import '@unocss/reset/tailwind-compat.css';
+
 // Register icon sprite
 import 'virtual:svg-icons-register';
 import { createApp } from 'vue';

src/views/my/index.vue

@@ -5,7 +5,7 @@
       class="my-card shadow-xl relative -top-150px mx-40px rounded-2xl flex flex-col items-center pb-20px"
     >
       <van-image
-        class="border-4 !absolute -top-90px h-170px w-170px"
+        class="border-4 border-solid !absolute -top-90px h-170px w-170px"
         round
         fit="cover"
         :src="avatar"
@@ -100,6 +100,7 @@
   .my-bg {
     clip-path: inset(0 -55% 0 -55% round 0 0 100% 100%);
     background-size: cover;
+
     &::after {
       content: '';
       position: absolute;
@@ -111,12 +112,15 @@
       opacity: 0.9;
     }
   }
+
   .van-cell {
     align-items: center;
     background: transparent;
+
     &:active {
       background-color: var(--van-cell-active-color);
     }
+
     .xicon {
       margin-right: 10px;
     }