refactor: 简化unocss集成

2022-06-11 16:55:36 +08:00 · 2022-06-11 16:55:36 +08:00 · 67d966e096
commit 67d966e096
parent b5ac614943
10 changed files with 290 additions and 145 deletions
--- a/build/plugin/index.js
+++ b/build/plugin/index.js
@ -20,10 +20,15 @@ import { NaiveUiResolver } from 'unplugin-vue-components/resolvers'
 */
 import Icons from 'unplugin-icons/vite'

+/**
+ * * unocss插件，原子css
+ * https://github.com/antfu/unocss
+ */
+import Unocss from 'unocss/vite'
+
 // rollup打包分析插件
 import visualizer from 'rollup-plugin-visualizer'

-import { unocss } from './unocss'
 import { configHtmlPlugin } from './html'
 import { configMockPlugin } from './mock'

@ -35,8 +40,8 @@ export function createVitePlugins(viteEnv, isBuild) {
      resolvers: [NaiveUiResolver()],
    }),
    Icons({ compiler: 'vue3', autoInstall: true }),
-    unocss(),
    configHtmlPlugin(viteEnv, isBuild),
+    Unocss(),
  ]

  viteEnv?.VITE_APP_USE_MOCK && plugins.push(configMockPlugin(isBuild))
--- a/build/plugin/unocss.js
+++ b/build/plugin/unocss.js
@ -1,9 +0,0 @@
-import Unocss from 'unocss/vite'
-import { presetUno, presetAttributify, presetIcons } from 'unocss'
-
-// https://github.com/antfu/unocss
-export function unocss() {
-  return Unocss({
-    presets: [presetUno(), presetAttributify(), presetIcons()],
-  })
-}
--- a/package.json
+++ b/package.json
@ -25,9 +25,6 @@
    "@iconify-json/ant-design": "^1.1.1",
    "@iconify-json/mdi": "^1.1.9",
    "@iconify-json/simple-icons": "^1.1.7",
-    "@unocss/preset-attributify": "^0.16.4",
-    "@unocss/preset-icons": "^0.16.4",
-    "@unocss/preset-uno": "^0.16.4",
    "@vitejs/plugin-vue": "^1.10.2",
    "@vue/compiler-sfc": "^3.2.31",
    "chalk": "^5.0.1",
@ -42,7 +39,7 @@
    "prettier": "^2.6.1",
    "rollup-plugin-visualizer": "^5.6.0",
    "sass": "^1.49.10",
-    "unocss": "^0.16.4",
+    "unocss": "^0.38.2",
    "unplugin-icons": "^0.14.1",
    "unplugin-vue-components": "^0.17.21",
    "vite": "^2.9.9",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -4,9 +4,6 @@ specifiers:
  '@iconify-json/ant-design': ^1.1.1
  '@iconify-json/mdi': ^1.1.9
  '@iconify-json/simple-icons': ^1.1.7
-  '@unocss/preset-attributify': ^0.16.4
-  '@unocss/preset-icons': ^0.16.4
-  '@unocss/preset-uno': ^0.16.4
  '@vitejs/plugin-vue': ^1.10.2
  '@vue/compiler-sfc': ^3.2.31
  '@vueuse/core': ^8.4.2
@ -28,7 +25,7 @@ specifiers:
  prettier: ^2.6.1
  rollup-plugin-visualizer: ^5.6.0
  sass: ^1.49.10
-  unocss: ^0.16.4
+  unocss: ^0.38.2
  unplugin-icons: ^0.14.1
  unplugin-vue-components: ^0.17.21
  vite: ^2.9.9
@ -53,9 +50,6 @@ devDependencies:
  '@iconify-json/ant-design': 1.1.1
  '@iconify-json/mdi': 1.1.9
  '@iconify-json/simple-icons': 1.1.7
-  '@unocss/preset-attributify': 0.16.4
-  '@unocss/preset-icons': 0.16.4
-  '@unocss/preset-uno': 0.16.4
  '@vitejs/plugin-vue': 1.10.2_vite@2.9.9
  '@vue/compiler-sfc': 3.2.31
  chalk: 5.0.1
@ -70,7 +64,7 @@ devDependencies:
  prettier: 2.6.1
  rollup-plugin-visualizer: 5.6.0
  sass: 1.49.10
-  unocss: 0.16.4
+  unocss: 0.38.2_vite@2.9.9
  unplugin-icons: 0.14.1_jyihscimozjyoh3ugo77i7phoi
  unplugin-vue-components: 0.17.21_vite@2.9.9+vue@3.2.31
  vite: 2.9.9_sass@1.49.10
@ -87,12 +81,6 @@ packages:
      find-up: 5.0.0
    dev: true

-  /@antfu/utils/0.3.0:
-    resolution: {integrity: sha512-UU8TLr/EoXdg7OjMp0h9oDoIAVr+Z/oW9cpOxQQyrsz6Qzd2ms/1CdWx8fl2OQdFpxGmq5Vc4TwfLHId6nAZjA==}
-    dependencies:
-      '@types/throttle-debounce': 2.1.0
-    dev: true
-
  /@antfu/utils/0.4.0:
    resolution: {integrity: sha512-gqkpvjkgFUu+s3kP+Ly33OKpo5zvVY3FDFhv5BIb98SncS3KD6DNxPfNDjwHIoyXbz1leWo1j8DtRLZ1D2Jv+Q==}
    dependencies:
@ -103,6 +91,10 @@ packages:
    resolution: {integrity: sha512-MrAQ/MrPSxbh1bBrmwJjORfJymw4IqSHFBXqvxaga3ZdDM+/zokYF8DjyJpSjY2QmpmgQrajDUBJOWrYeARfzA==}
    dev: true

+  /@antfu/utils/0.5.2:
+    resolution: {integrity: sha512-CQkeV+oJxUazwjlHD0/3ZD08QWKuGQkhnrKo3e6ly5pd48VUpXbb77q0xMU4+vc2CkJnDS02Eq/M9ugyX20XZA==}
+    dev: true
+
  /@babel/parser/7.17.8:
    resolution: {integrity: sha512-BoHhDJrJXqcg+ZL16Xv39H9n+AqJ4pcDrQBGZN+wHxIysrLZ3/ECwCBUch/1zUNhnsXULcONU3Ei5Hmkfk6kiQ==}
    engines: {node: '>=6.0.0'}
@ -257,6 +249,14 @@ packages:
      picomatch: 2.3.1
    dev: true

+  /@rollup/pluginutils/4.2.1:
+    resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
+    engines: {node: '>= 8.0.0'}
+    dependencies:
+      estree-walker: 2.0.2
+      picomatch: 2.3.1
+    dev: true
+
  /@types/estree/0.0.39:
    resolution: {integrity: sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==}
    dev: true
@ -296,94 +296,138 @@ packages:
    resolution: {integrity: sha512-5eQEtSCoESnh2FsiLTxE121IiE60hnMqcb435fShf4bpLRjEu1Eoekht23y6zXS9Ts3l+Szu3TARnTsA0GkOkQ==}
    dev: true

-  /@unocss/cli/0.16.4:
-    resolution: {integrity: sha512-RARhyxcZn3eHE+3kI79mdvWnve0tNC3d0a/4QzTZa2cVBSLDNwJswr8hpRh7bzzZyn6GXUl4LsdmHhqTk/zqIg==}
+  /@unocss/cli/0.38.2:
+    resolution: {integrity: sha512-9piPujcrHZbd3CEEghdhnGKAMVRzk70op9VEB9s3sxEqEpgomwHvGkTnDlOey4z4bHqgKWnkAteaLvQbUP/L5w==}
    engines: {node: '>=14'}
    hasBin: true
    dependencies:
-      '@unocss/config': 0.16.4
-      '@unocss/core': 0.16.4
-      '@unocss/preset-uno': 0.16.4
+      '@unocss/config': 0.38.2
+      '@unocss/core': 0.38.2
+      '@unocss/preset-uno': 0.38.2
      cac: 6.7.12
      chokidar: 3.5.3
      colorette: 2.0.16
      consola: 2.15.3
      fast-glob: 3.2.11
-      pathe: 0.2.0
+      pathe: 0.3.0
+      perfect-debounce: 0.1.3
    dev: true

-  /@unocss/config/0.16.4:
-    resolution: {integrity: sha512-aC2ux89pjhzjyNh6LOOjyeWNdXgHgxRBoR5zf/Ug/vbMM0a+uNf6nB2odk/4V3n2XeW/GVFklIhTnbuqFV5rtg==}
+  /@unocss/config/0.38.2:
+    resolution: {integrity: sha512-ttknaVVxKX7K9ais42iJO9sxpt6mVAnQuQHUokR134Q9GrPVDbN232K+jViqWY+TuVlaSgl6Fafx1DwiYsEAbQ==}
    engines: {node: '>=14'}
    dependencies:
-      '@unocss/core': 0.16.4
-      unconfig: 0.2.2
+      '@unocss/core': 0.38.2
+      unconfig: 0.3.4
    dev: true

-  /@unocss/core/0.16.4:
-    resolution: {integrity: sha512-zbZnnm9tAHuf9Y8pDSj1+vQ7HsORMMWdC1VXQ4WIrj0MIQaGRh1WLDXhutc3KEckAQF/zrufnR2DR7bzWj5LaA==}
+  /@unocss/core/0.38.2:
+    resolution: {integrity: sha512-GXJs1R0oRESgPv4UZKvNZCTnT5Iebn/E0bAHHaCugko2ccnqh6bHul7fcShXICwgT+hyQBPEF5SNS2BPcEjKpQ==}
    dev: true

-  /@unocss/inspector/0.16.4:
-    resolution: {integrity: sha512-YdfASsa4PmMNS5AG+Wpm4ZnDmFTbTgL9AN1QY5YzQYr2xJbs7c57opGuiAKwHzVUiPamqgRT5kPhimUUphSe5A==}
+  /@unocss/inspector/0.38.2:
+    resolution: {integrity: sha512-d1HojYl/ztE/+UXMcvOWw7gGewZ/GyhvaHVNsaENcH0ORPootSS1PvE2JhPYiIs43IYq6ZzRFCVH0MUqL8ARhQ==}
    dependencies:
      gzip-size: 6.0.0
-      sirv: 1.0.19
+      sirv: 2.0.2
    dev: true

-  /@unocss/preset-attributify/0.16.4:
-    resolution: {integrity: sha512-res6mXDtNfELjtHbK0JgAFzmpuTvUA7vPAxOb0ECZ4+hz31BSw4SHgOSVYojUhY708fz9U5UwmBF18AB/2n3AA==}
+  /@unocss/preset-attributify/0.38.2:
+    resolution: {integrity: sha512-ySW1kG9eyyUK33nHmOIxGw2oGJqmNv39KwMN5MQL3314WVXl3JsViD2TG4LGktVR6K64mrNAC9TUG/eEXaRLLQ==}
    dependencies:
-      '@unocss/core': 0.16.4
+      '@unocss/core': 0.38.2
    dev: true

-  /@unocss/preset-icons/0.16.4:
-    resolution: {integrity: sha512-1gUBOHRRCPRdy+jiF4sRDmYeA/5SYNEColKpoly0sG0Eu5BxqJNBoby9KSlNHtju6vCTj48xx4bc3h8ko93Ggw==}
+  /@unocss/preset-icons/0.38.2:
+    resolution: {integrity: sha512-C4OB09aOW4SVTSRTLQ8gVLSnaFCEccRwDz9ZfJsjVs1pClBU0d5MvNGc3ORDW6u29rOyWaIgEMkFtDW6vDQyOw==}
    dependencies:
      '@iconify/utils': 1.0.32
-      '@unocss/core': 0.16.4
-      local-pkg: 0.4.1
+      '@unocss/core': 0.38.2
+      ohmyfetch: 0.4.18
    transitivePeerDependencies:
      - supports-color
    dev: true

-  /@unocss/preset-mini/0.16.4:
-    resolution: {integrity: sha512-4SXfpmRAgtr1E62ExY2cdNIkTRNV2AkoUp61/L0RbhkkCSKZ8ux7P3Pey0uaAyYryTEps3I9SJWq1wNN2XhmJw==}
+  /@unocss/preset-mini/0.38.2:
+    resolution: {integrity: sha512-xrZHcgjLuOY12+UxnpA0zHtLFnxG1hYWS9CFa/odUM7jtjLq/u+E3LVv4/g/+mwcXyj6EIfe4ItE87s3R87zzg==}
    dependencies:
-      '@unocss/core': 0.16.4
+      '@unocss/core': 0.38.2
    dev: true

-  /@unocss/preset-uno/0.16.4:
-    resolution: {integrity: sha512-qTjaPo7YB3kz6+lW71lPHKGH49CiG+/eqe8ycd4M3HhDEXWNOqhkkGoXz7HzqpUUkm0xiTIoptuCQOkXKhlqdA==}
+  /@unocss/preset-tagify/0.38.2:
+    resolution: {integrity: sha512-gLOuTQh5epGDMOeDA1KpAh2ygpIZgW9I03WttGaCrlavHBI1PPN2gt6wQe73htetfiwVn7QBPlq1/CKX8CVsvQ==}
    dependencies:
-      '@unocss/core': 0.16.4
-      '@unocss/preset-mini': 0.16.4
-      '@unocss/preset-wind': 0.16.4
+      '@unocss/core': 0.38.2
    dev: true

-  /@unocss/preset-wind/0.16.4:
-    resolution: {integrity: sha512-o/PB+tx/gX1x8zHtXmX/MW5lwOWqu2se1m8X9UeCxdsUw0mpOU3hU0SH+yVn2Lwxbds1GneUL+QNDR9kbjp1YA==}
+  /@unocss/preset-typography/0.38.2:
+    resolution: {integrity: sha512-5MgQKEJmeKC0UehosPLm091Ly+sDRUHtoU71KHsB5llh4WARVy2etIerDxVza5JH7FEIseNUIT5lGZeo5S78Ng==}
    dependencies:
-      '@unocss/core': 0.16.4
-      '@unocss/preset-mini': 0.16.4
+      '@unocss/core': 0.38.2
    dev: true

-  /@unocss/reset/0.16.4:
-    resolution: {integrity: sha512-lTnNoJr2n5drOVxoB7Im6C/eFCixQfmEcN+BtR/J30lIfQwUuRz/yGywaLWqUWkyqKMqeY0qISu/gE69aPEZ9w==}
-    dev: true
-
-  /@unocss/scope/0.16.4:
-    resolution: {integrity: sha512-hfENQKMBkncGI5S6elGVRcSJ1Fz665H3vlz6/TdLSHW1nsBawcLCjfaPSLz4gS23Zgk+TdCRMEYrW4vOup9YMA==}
-    dev: true
-
-  /@unocss/vite/0.16.4:
-    resolution: {integrity: sha512-mhQXZ0mUQNW8eNG2X683qpZEOnvqu94QTO/8mDvIgenli1+hZDioR1nDoPeNLDr5U8iiOnNH9q8qIoRojFmvGQ==}
+  /@unocss/preset-uno/0.38.2:
+    resolution: {integrity: sha512-BKDTa9FazpQFJhdDZWA6aOYq9tIBdm0XSTQC+Vk20h3yKVF3GlIBjuR5IMZ+ydEkLR/c6kjzdqqKbtHUqEyFXw==}
    dependencies:
-      '@rollup/pluginutils': 4.2.0
-      '@unocss/config': 0.16.4
-      '@unocss/core': 0.16.4
-      '@unocss/inspector': 0.16.4
-      '@unocss/scope': 0.16.4
+      '@unocss/core': 0.38.2
+      '@unocss/preset-mini': 0.38.2
+      '@unocss/preset-wind': 0.38.2
+    dev: true
+
+  /@unocss/preset-web-fonts/0.38.2:
+    resolution: {integrity: sha512-Gjceka7dlhDC7HH/BRmExfnvPf+6SScfQnaaubsHsJY6aQ55lfZfhD82aNUXUk3p9wUr/M27VQGQ1wCV90G9cA==}
+    dependencies:
+      '@unocss/core': 0.38.2
+      ohmyfetch: 0.4.18
+    dev: true
+
+  /@unocss/preset-wind/0.38.2:
+    resolution: {integrity: sha512-e6I07llFT73aMPR7KOk6ebWQUS3SNvu3c5DCriS+iqbplbdQtTP5Ox6Os33FjNIwzjxz8cSwUKUhRGODuFkFyg==}
+    dependencies:
+      '@unocss/core': 0.38.2
+      '@unocss/preset-mini': 0.38.2
+    dev: true
+
+  /@unocss/reset/0.38.2:
+    resolution: {integrity: sha512-bK6khIAUQ2syp1eAq3hYK0ONqIBEZsBxMLZg8uFQOepXTJIHDH7fTm5gEXpCFcHJx91Onfcx9V9Twh4DjJv0wQ==}
+    dev: true
+
+  /@unocss/scope/0.38.2:
+    resolution: {integrity: sha512-8tWsn1Ur8gQzSw8Z2tsoaUWEniOPIBBlH3cZlmkVgtOzndp3/JSFRu+lPcrbvEEN7IW2N1sPV5qQ2addHgmFmA==}
+    dev: true
+
+  /@unocss/transformer-compile-class/0.38.2:
+    resolution: {integrity: sha512-Jq+eu3x9griX0m8jMCIZaQJKmFD6ZBGaD0qGQ5GoaPUllYdN1qAE3VdYDRobkMXOEsem8+72esOAExzZhr6oxg==}
+    dependencies:
+      '@unocss/core': 0.38.2
+    dev: true
+
+  /@unocss/transformer-directives/0.38.2:
+    resolution: {integrity: sha512-x4WhCorfN2r3qgcG31RQhNeyypIYyrqvpt2J/X7s+8MBqcgMFTupQYgVsKw7mOWHlYtEiNA1K7Evr+yOHEMQaA==}
+    dependencies:
+      '@unocss/core': 0.38.2
+      css-tree: 2.1.0
+    dev: true
+
+  /@unocss/transformer-variant-group/0.38.2:
+    resolution: {integrity: sha512-nk8gesr66V7dtcFtN3enzh+wzQN6DCLtX7+ASV5/mm58F83PdmGdfV0vFANjL4e/OngmO99cViYDLlN4DHn6Aw==}
+    dependencies:
+      '@unocss/core': 0.38.2
+    dev: true
+
+  /@unocss/vite/0.38.2_vite@2.9.9:
+    resolution: {integrity: sha512-DuYhbH9L5tWa0bntJySIVWbGkJKH9MwxZ51QKrEHh76c+YzZZo+B8k485GJhCb9bfjT5BxpDhxxZQTaaeA3HbA==}
+    peerDependencies:
+      vite: ^2.9.0
+    dependencies:
+      '@rollup/pluginutils': 4.2.1
+      '@unocss/config': 0.38.2
+      '@unocss/core': 0.38.2
+      '@unocss/inspector': 0.38.2
+      '@unocss/scope': 0.38.2
+      '@unocss/transformer-directives': 0.38.2
+      magic-string: 0.26.2
+      vite: 2.9.9_sass@1.49.10
    dev: true

  /@vitejs/plugin-vue/1.10.2_vite@2.9.9:
@ -761,6 +805,14 @@ packages:
      nth-check: 2.0.1
    dev: true

+  /css-tree/2.1.0:
+    resolution: {integrity: sha512-PcysZRzToBbrpoUrZ9qfblRIRf8zbEAkU0AIpQFtgkFK0vSbzOmBCvdSAx2Zg7Xx5wiYJKUKk0NMP7kxevie/A==}
+    engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0, npm: '>=7.0.0'}
+    dependencies:
+      mdn-data: 2.0.27
+      source-map-js: 1.0.2
+    dev: true
+
  /css-what/6.1.0:
    resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
    engines: {node: '>= 6'}
@ -823,8 +875,12 @@ packages:
    engines: {node: '>=8'}
    dev: true

-  /defu/5.0.1:
-    resolution: {integrity: sha512-EPS1carKg+dkEVy3qNTqIdp2qV7mUP08nIsupfwQpz++slCVRw7qbQyWvSTig+kFPwz2XXp5/kIIkH+CwrJKkQ==}
+  /defu/6.0.0:
+    resolution: {integrity: sha512-t2MZGLf1V2rV4VBZbWIaXKdX/mUcYW0n2znQZoADBkGGxYL8EWqCuCZBmJPJ/Yy9fofJkyuuSuo5GSwo0XdEgw==}
+    dev: true
+
+  /destr/1.1.1:
+    resolution: {integrity: sha512-QqkneF8LrYmwATMdnuD2MLI3GHQIcBnG6qFC2q9bSH430VTCDAVjcspPmUaKhPGtAtPAftIUFqY1obQYQuwmbg==}
    dev: true

  /diff-sequences/27.5.1:
@ -1789,11 +1845,22 @@ packages:
    dependencies:
      sourcemap-codec: 1.4.8

+  /magic-string/0.26.2:
+    resolution: {integrity: sha512-NzzlXpclt5zAbmo6h6jNc8zl2gNRGHvmsZW4IvZhTC4W7k4OlLP+S5YLussa/r3ixNT66KOQfNORlXHSOy/X4A==}
+    engines: {node: '>=12'}
+    dependencies:
+      sourcemap-codec: 1.4.8
+    dev: true
+
  /md-editor-v3/1.11.4:
    resolution: {integrity: sha512-C0I5raxHchWPLMHGM+a6EjQ2V29eU0qDjbKe4rE2K2U2i81PA7nKCQKOIxSYFxXXVh6EvHKPK/HImQuxNblJmw==}
    engines: {node: '>=12.0.0'}
    dev: false

+  /mdn-data/2.0.27:
+    resolution: {integrity: sha512-kwqO0I0jtWr25KcfLm9pia8vLZ8qoAKhWZuZMbneJq3jjBD3gl5nZs8l8Tu3ZBlBAHVQtDur9rdDGyvtfVraHQ==}
+    dev: true
+
  /merge-stream/2.0.0:
    resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
    dev: true
@ -1836,8 +1903,8 @@ packages:
      commander: 8.3.0
    dev: false

-  /mrmime/1.0.0:
-    resolution: {integrity: sha512-a70zx7zFfVO7XpnQ2IX1Myh9yY4UYvfld/dikWRnsXxbyvMcfz+u6UfgNAtH+k2QqtJuzVpv6eLTx1G2+WKZbQ==}
+  /mrmime/1.0.1:
+    resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
    engines: {node: '>=10'}
    dev: true

@ -1896,6 +1963,10 @@ packages:
      tslib: 2.4.0
    dev: true

+  /node-fetch-native/0.1.3:
+    resolution: {integrity: sha512-Jf1IQZdovUIv9E+5avmN6Sf+bND+rnMlODnBQhdE2VRyuWP9WgqZb/KEgPekh19DAN1X2C4vbS1VCOaz2OH19g==}
+    dev: true
+
  /node-html-parser/5.3.3:
    resolution: {integrity: sha512-ncg1033CaX9UexbyA7e1N0aAoAYRDiV8jkTvzEnfd1GDvzFdrsXLzR4p4ik8mwLgnaKP/jyUFWDy9q3jvRT2Jw==}
    dependencies:
@ -1921,6 +1992,15 @@ packages:
      boolbase: 1.0.0
    dev: true

+  /ohmyfetch/0.4.18:
+    resolution: {integrity: sha512-MslzNrQzBLtZHmiZBI8QMOcMpdNFlK61OJ34nFNFynZ4v+4BonfCQ7VIN4EGXvGGq5zhDzgdJoY3o9S1l2T7KQ==}
+    dependencies:
+      destr: 1.1.1
+      node-fetch-native: 0.1.3
+      ufo: 0.8.4
+      undici: 5.4.0
+    dev: true
+
  /on-finished/2.3.0:
    resolution: {integrity: sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=}
    engines: {node: '>= 0.8'}
@ -2029,6 +2109,14 @@ packages:
    resolution: {integrity: sha512-sTitTPYnn23esFR3RlqYBWn4c45WGeLcsKzQiUpXJAyfcWkolvlYpV8FLo7JishK946oQwMFUCHXQ9AjGPKExw==}
    dev: true

+  /pathe/0.3.0:
+    resolution: {integrity: sha512-3vUjp552BJzCw9vqKsO5sttHkbYqqsZtH0x1PNtItgqx8BXEXzoY1SYRKcL6BTyVh4lGJGLj0tM42elUDMvcYA==}
+    dev: true
+
+  /perfect-debounce/0.1.3:
+    resolution: {integrity: sha512-NOT9AcKiDGpnV/HBhI22Str++XWcErO/bALvHCuhv33owZW/CjH8KAFLZDCmu3727sihe0wTxpDhyGc6M8qacQ==}
+    dev: true
+
  /picocolors/1.0.0:
    resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}

@ -2226,13 +2314,13 @@ packages:
    resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
    dev: true

-  /sirv/1.0.19:
-    resolution: {integrity: sha512-JuLThK3TnZG1TAKDwNIqNq6QA2afLOCcm+iE8D1Kj3GA40pSPsxQjjJl0J8X3tsR7T+CP1GavpzLwYkgVLWrZQ==}
+  /sirv/2.0.2:
+    resolution: {integrity: sha512-4Qog6aE29nIjAOKe/wowFTxOdmbEZKb+3tsLljaBRzJwtqto0BChD2zzH0LhgCSXiI+V7X+Y45v14wBZQ1TK3w==}
    engines: {node: '>= 10'}
    dependencies:
      '@polka/url': 1.0.0-next.21
-      mrmime: 1.0.0
-      totalist: 1.1.0
+      mrmime: 1.0.1
+      totalist: 3.0.0
    dev: true

  /source-map-js/1.0.2:
@ -2330,8 +2418,8 @@ packages:
      is-number: 7.0.0
    dev: true

-  /totalist/1.1.0:
-    resolution: {integrity: sha512-gduQwd1rOdDMGxFG1gEvhV88Oirdo2p+KjoYFU7k2g+i7n6AFFbDQ5kMPUsW0pNbfQsB/cwXvT1i4Bue0s9g5g==}
+  /totalist/3.0.0:
+    resolution: {integrity: sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw==}
    engines: {node: '>=6'}
    dev: true

@ -2361,32 +2449,55 @@ packages:
    engines: {node: '>=10'}
    dev: true

-  /unconfig/0.2.2:
-    resolution: {integrity: sha512-JN1MeYJ/POnjBj7NgOJJxPp6+NcD6Nd0hEuK0D89kjm9GvQQUq8HeE2Eb7PZgtu+64mWkDiqeJn1IZoLH7htPg==}
+  /ufo/0.8.4:
+    resolution: {integrity: sha512-/+BmBDe8GvlB2nIflWasLLAInjYG0bC9HRnfEpNi4sw77J2AJNnEVnTDReVrehoh825+Q/evF3THXTAweyam2g==}
+    dev: true
+
+  /unconfig/0.3.4:
+    resolution: {integrity: sha512-cf39F1brwQuLSuMLTYXOdWJH0O1CJee6a4QW1nYtO7SoBUfVvQCvEel6ssTNXtPfi17kop1ADmVtmC49NlFkIQ==}
    dependencies:
-      '@antfu/utils': 0.3.0
-      defu: 5.0.1
+      '@antfu/utils': 0.5.2
+      defu: 6.0.0
      jiti: 1.13.0
    dev: true

+  /undici/5.4.0:
+    resolution: {integrity: sha512-A1SRXysDg7J+mVP46jF+9cKANw0kptqSFZ8tGyL+HBiv0K1spjxPX8Z4EGu+Eu6pjClJUBdnUPlxrOafR668/g==}
+    engines: {node: '>=12.18'}
+    dev: true
+
  /universalify/2.0.0:
    resolution: {integrity: sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==}
    engines: {node: '>= 10.0.0'}
    dev: true

-  /unocss/0.16.4:
-    resolution: {integrity: sha512-pACSXJUa18RR7N712lPJD/dtwPjaItt2sRxcLSF79aa71d2S6dUPM5QkuHJyEwmMPvHTAssgUHmMa+wFquoyqQ==}
+  /unocss/0.38.2_vite@2.9.9:
+    resolution: {integrity: sha512-YSADRlI55kt7tnpHWFDJGTdBfhQ5IshhXP6dJJd9f8ma/SIV/DW+gyYyL9VFDCqCDLuQBRmJTRX2NE4jGfZiug==}
    engines: {node: '>=14'}
+    peerDependencies:
+      '@unocss/webpack': 0.38.2
+    peerDependenciesMeta:
+      '@unocss/webpack':
+        optional: true
    dependencies:
-      '@unocss/cli': 0.16.4
-      '@unocss/core': 0.16.4
-      '@unocss/preset-attributify': 0.16.4
-      '@unocss/preset-icons': 0.16.4
-      '@unocss/preset-uno': 0.16.4
-      '@unocss/reset': 0.16.4
-      '@unocss/vite': 0.16.4
+      '@unocss/cli': 0.38.2
+      '@unocss/core': 0.38.2
+      '@unocss/preset-attributify': 0.38.2
+      '@unocss/preset-icons': 0.38.2
+      '@unocss/preset-mini': 0.38.2
+      '@unocss/preset-tagify': 0.38.2
+      '@unocss/preset-typography': 0.38.2
+      '@unocss/preset-uno': 0.38.2
+      '@unocss/preset-web-fonts': 0.38.2
+      '@unocss/preset-wind': 0.38.2
+      '@unocss/reset': 0.38.2
+      '@unocss/transformer-compile-class': 0.38.2
+      '@unocss/transformer-directives': 0.38.2
+      '@unocss/transformer-variant-group': 0.38.2
+      '@unocss/vite': 0.38.2_vite@2.9.9
    transitivePeerDependencies:
      - supports-color
+      - vite
    dev: true

  /unpipe/1.0.0:
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@ -18,6 +18,7 @@
      <n-layout style="background-color: #f5f6fb" :style="`height: calc(100% - ${useTheme.header.height}px)`">
        <AppTags v-if="useTheme.tags.visible" />
        <AppMain
+          class="cur-scroll"
          :style="{
            height: `calc(100% - ${useTheme.tags.visible ? useTheme.tags.height : 0}px)`,
            overflow: 'auto',
--- a/src/main.js
+++ b/src/main.js
@ -1,3 +1,4 @@
+import '@/styles/reset.css'
 import '@/styles/index.scss'
 import 'uno.css'

--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@ -1,2 +1,54 @@
-@import './reset.scss';
-@import './public.scss';
+html {
+  font-size: 4px; // * 1rem = 4px  方便unocss计算：在unocss中 1字体单位 = 0.25rem，相当于 1等份 = 1px
+}
+
+html,
+body {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background-color: #f2f2f2;
+  font-family: 'Encode Sans Condensed', sans-serif;
+}
+
+/* router view transition fade-slide */
+.fade-slide-leave-active,
+.fade-slide-enter-active {
+  transition: all 0.3s;
+}
+
+.fade-slide-enter-from {
+  opacity: 0;
+  transform: translateX(-30px);
+}
+
+.fade-slide-leave-to {
+  opacity: 0;
+  transform: translateX(30px);
+}
+
+/* 自定义滚动条样式 */
+.cur-scroll {
+  &::-webkit-scrollbar{
+    width:8px;
+    height:8px;
+  }
+  &::-webkit-scrollbar-thumb{
+    background-color: transparent;
+    border-radius:4px;
+  }
+  
+  &::-webkit-scrollbar-corner{
+    background: #f6f6f6;
+  }
+  &:hover {
+    &::-webkit-scrollbar-thumb {
+      background: #bfbfbf;
+    }
+    &::-webkit-scrollbar-thumb:hover{
+      background: #999999;
+    }
+  }
+}
+
+
--- a/src/styles/public.scss
+++ b/src/styles/public.scss
@ -1,42 +0,0 @@
-html {
-  font-size: 4px; // * 1rem = 4px  方便unocss计算：在unocss中 1字体单位 = 0.25rem，相当于 1等份 = 1px
-}
-
-html,
-body {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  background-color: #f2f2f2;
-  font-family: 'Encode Sans Condensed', sans-serif;
-}
-
-/* router view transition fade-slide */
-.fade-slide-leave-active,
-.fade-slide-enter-active {
-  transition: all 0.3s;
-}
-
-.fade-slide-enter-from {
-  opacity: 0;
-  transform: translateX(-30px);
-}
-
-.fade-slide-leave-to {
-  opacity: 0;
-  transform: translateX(30px);
-}
-
-/* 滚动条样式 */
-::-webkit-scrollbar {
-  width: 8px;
-  background-color: #eee;
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: #c1c1c1;
-
-  &:hover {
-    background-color: #a8a8a8;
-  }
-}
--- a/src/styles/reset.scss
+++ b/src/styles/reset.scss
--- a/unocss.config.js
+++ b/unocss.config.js
@ -0,0 +1,29 @@
+import { defineConfig, presetAttributify, presetIcons, presetUno, presetWebFonts } from 'unocss'
+
+export default defineConfig({
+  shortcuts: [
+    [
+      'btn',
+      'px-4 py-1 rounded inline-block bg-teal-600 text-white cursor-pointer hover:bg-teal-700 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50',
+    ],
+    [
+      'icon-btn',
+      'text-[0.9em] inline-block cursor-pointer select-none opacity-75 transition duration-200 ease-in-out hover:opacity-100 hover:text-teal-600',
+    ],
+  ],
+  presets: [
+    presetUno(),
+    presetAttributify(),
+    presetIcons({
+      scale: 1.2,
+      warn: true,
+    }),
+    presetWebFonts({
+      fonts: {
+        sans: 'DM Sans',
+        serif: 'DM Serif Display',
+        mono: 'DM Mono',
+      },
+    }),
+  ],
+})