chore: Add UnoCSS for easier CSS styling (#45)

This commit is contained in:
CharleeWa 2023-11-13 15:54:06 +08:00
parent 04e056c44e
commit 92564364a5
11 changed files with 480 additions and 10 deletions

View File

@ -32,6 +32,7 @@ English / [简体中文](./README-zh_CN.md) , [使用指南](./Guide-zh_CN.md) /
- 🌈 Support Git hooks (lint and commit)
- 💖 Mobile UI Components (Vant4)
- 🍍 Pinia, Store for Vue
- 🪶 Support Unocss and Less
## Install and use

View File

@ -8,9 +8,9 @@
"dev": "cross-env MOCK_SERVER_PORT=8086 vite",
"build": "vue-tsc --noEmit && vite build",
"build:dev": "vue-tsc --noEmit && vite build --mode=development",
"preview": "npm run build && vite preview",
"lint": "eslint .",
"lint:fix": "eslint . --fix",
"preview": "vite preview",
"test": "vitest",
"plop": "plop",
"prepare": "npx husky install"
@ -42,6 +42,7 @@
"@types/node": "^20.9.0",
"@types/nprogress": "^0.2.3",
"@types/store": "^2.0.5",
"@unocss/preset-rem-to-px": "^0.57.3",
"@vitejs/plugin-legacy": "^4.1.1",
"@vitejs/plugin-vue": "^4.4.0",
"@vitejs/plugin-vue-jsx": "^3.0.2",
@ -64,6 +65,7 @@
"slash2": "^2.0.0",
"terser": "^5.24.0",
"typescript": "^5.2.2",
"unocss": "^0.57.3",
"unplugin-auto-import": "^0.16.7",
"unplugin-vue-components": "^0.25.2",
"vite": "^4.5.0",
@ -75,7 +77,10 @@
"peerDependencyRules": {
"ignoreMissing": [
"postcss"
]
],
"allowedVersions": {
"rollup": "^4.x"
}
}
},
"config": {

View File

@ -79,6 +79,9 @@ devDependencies:
'@types/store':
specifier: ^2.0.5
version: 2.0.5
'@unocss/preset-rem-to-px':
specifier: ^0.57.3
version: 0.57.3
'@vitejs/plugin-legacy':
specifier: ^4.1.1
version: 4.1.1(terser@5.24.0)(vite@4.5.0)
@ -145,6 +148,9 @@ devDependencies:
typescript:
specifier: ^5.2.2
version: 5.2.2
unocss:
specifier: ^0.57.3
version: 0.57.3(rollup@4.3.0)(vite@4.5.0)
unplugin-auto-import:
specifier: ^0.16.7
version: 0.16.7(rollup@4.3.0)
@ -225,6 +231,13 @@ packages:
engines: {node: '>=18.0.0', npm: '>=9.0.0', pnpm: '>= 8.6.0'}
dev: true
/@antfu/install-pkg@0.1.1:
resolution: {integrity: sha512-LyB/8+bSfa0DFGC06zpCEfs89/XoWZwws5ygEa5D+Xsm3OfI+aXQ86VgVG7Acyef+rSZ5HE7J8rrxzrQeM3PjQ==}
dependencies:
execa: 5.1.1
find-up: 5.0.0
dev: true
/@antfu/utils@0.7.6:
resolution: {integrity: sha512-pvFiLP2BeOKA/ZOS6jxx4XhKzdVLHDhGlFEaZ2flWWYf2xOqVniqpk38I04DFRyz+L0ASggl7SkItTc+ZLju4w==}
dev: true
@ -1765,6 +1778,23 @@ packages:
resolution: {integrity: sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==}
dev: true
/@iconify/types@2.0.0:
resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
dev: true
/@iconify/utils@2.1.11:
resolution: {integrity: sha512-M/w3PkN8zQYXi8N6qK/KhnYMfEbbb6Sk8RZVn8g+Pmmu5ybw177RpsaGwpziyHeUsu4etrexYSWq3rwnIqzYCg==}
dependencies:
'@antfu/install-pkg': 0.1.1
'@antfu/utils': 0.7.6
'@iconify/types': 2.0.0
debug: 4.3.4
kolorist: 1.8.0
local-pkg: 0.4.3
transitivePeerDependencies:
- supports-color
dev: true
/@jest/schemas@29.6.3:
resolution: {integrity: sha512-mo5j5X+jIZmJQveBKeS/clAueipV7KgiX1vMgCxam1RNYiqE1w62n0/tJJnHtjW8ZHcQco5gY85jA3mi0L+nSA==}
engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
@ -1836,11 +1866,15 @@ packages:
fastq: 1.15.0
dev: true
/@polka/url@1.0.0-next.23:
resolution: {integrity: sha512-C16M+IYz0rgRhWZdCmK+h58JMv8vijAA61gmz2rspCSwKwzBebpdcsiUmwrtJRdphuY30i6BSLEOP8ppbNLyLg==}
dev: true
/@rollup/pluginutils@5.0.5(rollup@4.3.0):
resolution: {integrity: sha512-6aEYR910NyP73oHiJglti74iRyOwgFU4x3meH/H8OJx6Ry0j6cOVZ5X/wTvub7G7Ao6qaHBEaNsV3GLJkSsF+Q==}
engines: {node: '>=14.0.0'}
peerDependencies:
rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
rollup: ^1.20.0 || ^2.0.0 || ^3.0.0 || ^4.0.0 || ^4.x
peerDependenciesMeta:
rollup:
optional: true
@ -2235,6 +2269,223 @@ packages:
resolution: {integrity: sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==}
dev: true
/@unocss/astro@0.57.3(rollup@4.3.0)(vite@4.5.0):
resolution: {integrity: sha512-Kwu/k8iGNVrMtOuzJ7jKOvjYZFZz3recSxd7ceDp5Hi5SMsmjvXXHzkQ1Iypj1g0nczWcX4U+krROr2EH0GlnA==}
peerDependencies:
vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0
peerDependenciesMeta:
vite:
optional: true
dependencies:
'@unocss/core': 0.57.3
'@unocss/reset': 0.57.3
'@unocss/vite': 0.57.3(rollup@4.3.0)(vite@4.5.0)
vite: 4.5.0(@types/node@20.9.0)(less@4.2.0)(terser@5.24.0)
transitivePeerDependencies:
- rollup
dev: true
/@unocss/cli@0.57.3(rollup@4.3.0):
resolution: {integrity: sha512-F5k0IjkbHFlZDcGAUr7UTa2xehxobfqWzooDL0tU9PtvAk6S4Edf5Iq0HymAcVK1k9yO17i7Pvg6dw7gOM0TIg==}
engines: {node: '>=14'}
hasBin: true
dependencies:
'@ampproject/remapping': 2.2.1
'@rollup/pluginutils': 5.0.5(rollup@4.3.0)
'@unocss/config': 0.57.3
'@unocss/core': 0.57.3
'@unocss/preset-uno': 0.57.3
cac: 6.7.14
chokidar: 3.5.3
colorette: 2.0.20
consola: 3.2.3
fast-glob: 3.3.2
magic-string: 0.30.5
pathe: 1.1.1
perfect-debounce: 1.0.0
transitivePeerDependencies:
- rollup
dev: true
/@unocss/config@0.57.3:
resolution: {integrity: sha512-jrjvmcrrdiHHLqp6LBpHWs7VAnumFK3fEdMH7celRe+99CTOvRn73caUThyD2Ftt8rDIMejmteR1hqVBH51kug==}
engines: {node: '>=14'}
dependencies:
'@unocss/core': 0.57.3
unconfig: 0.3.11
dev: true
/@unocss/core@0.57.3:
resolution: {integrity: sha512-o6snDo5vwAenIqA+wjjI6BUsftJXXSqrPHYqplb+QX5bLfxW/OU1xhBRlnhiP0BOGGZXqgGEETU1ym8MM9bLwA==}
dev: true
/@unocss/extractor-arbitrary-variants@0.57.3:
resolution: {integrity: sha512-OmF+2TjJ97i7KOCR8wPgZK/pkp8Rcfo4tzqT/4jBUIi7rfDGZx/eE3aZKFpZSZlUuTH5cdReaKxymXQmJ4dibA==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/inspector@0.57.3:
resolution: {integrity: sha512-Oj5cUbuwx+4/rckW3mfpdKMWzhOOSehXChzuJ7x7tMDDB5ywdHwnDsxtK07Y+5UwKHC322T3I3VtLolOfsdlCA==}
dependencies:
'@unocss/core': 0.57.3
'@unocss/rule-utils': 0.57.3
gzip-size: 6.0.0
sirv: 2.0.3
dev: true
/@unocss/postcss@0.57.3:
resolution: {integrity: sha512-rYXQ2/iXeF59/g8xbvoyYJ9EClQCBcWj2oeJCt85dykOYyQJCWJT+LoYF0s/kvg7m+x5ovdNQfXtAACLYBqh9g==}
engines: {node: '>=14'}
peerDependencies:
postcss: ^8.4.21
peerDependenciesMeta:
postcss:
optional: true
dependencies:
'@unocss/config': 0.57.3
'@unocss/core': 0.57.3
'@unocss/rule-utils': 0.57.3
css-tree: 2.3.1
fast-glob: 3.3.2
magic-string: 0.30.5
dev: true
/@unocss/preset-attributify@0.57.3:
resolution: {integrity: sha512-leX9jxM2PnqvZn42thDb2rPdE0nq6WtIr98pvdnkRZKt5gLwtOJCANXH/gVP6tPdRRf6FiZstA8jvAxVGL1sIA==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/preset-icons@0.57.3:
resolution: {integrity: sha512-cG7gaFQzSidHS+nHPV9HEB3aaUVs/PjZywxMl5jwkJIWHuFMU/SQZXMorH6avU2jH8PoYkRZfjLdRWA+h/+fPA==}
dependencies:
'@iconify/utils': 2.1.11
'@unocss/core': 0.57.3
ofetch: 1.3.3
transitivePeerDependencies:
- supports-color
dev: true
/@unocss/preset-mini@0.57.3:
resolution: {integrity: sha512-2KFxbbxRqhc+0fyWNYSiRGGr+3jp4jEQIRnjT8sv5uAMo1OaUmUTwz2qzYhSc3sCM8ZEofblZY2BOcqJwZ5yxA==}
dependencies:
'@unocss/core': 0.57.3
'@unocss/extractor-arbitrary-variants': 0.57.3
'@unocss/rule-utils': 0.57.3
dev: true
/@unocss/preset-rem-to-px@0.57.3:
resolution: {integrity: sha512-Z+BvevAELZNGDjVw0nvcPabsD5u0SP8EGr8iY+oyFTmq4fkcfF8sKA+1xto4sl/KmYPTVdUOp+ii/Sn32VL3bA==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/preset-tagify@0.57.3:
resolution: {integrity: sha512-GXs5Hu6XtHcIRLexPghHkfb6ekSodh4Xs8895xrvP5H7Tm/+wEIHALXkW762Rujl1Rtq+xzxAeCoeFxW+y9eLw==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/preset-typography@0.57.3:
resolution: {integrity: sha512-C/pIfRY56wxBuV4bTIeZMZYMmYc0gD8DU+sJSPWiZJP1JHiLc3FzSnc51BYcT/Dqdx0fDWhJyP2qqo9000VFKQ==}
dependencies:
'@unocss/core': 0.57.3
'@unocss/preset-mini': 0.57.3
dev: true
/@unocss/preset-uno@0.57.3:
resolution: {integrity: sha512-dLZrFc6GrE5J0zAZMFXk/c4WKq7fmU0jCgHvbDXLGdKdJ7zpByslhc2YTPqkLW40F6+73SCN7DlARInSh2fa4g==}
dependencies:
'@unocss/core': 0.57.3
'@unocss/preset-mini': 0.57.3
'@unocss/preset-wind': 0.57.3
'@unocss/rule-utils': 0.57.3
dev: true
/@unocss/preset-web-fonts@0.57.3:
resolution: {integrity: sha512-W/voQjgo98oj/D/oGrhL4xAS0XsR6fF9yULu3xf4nWrUkdkZq/64/rOM5uLBgUFSmkulW524Dsjd1INYmPzz8w==}
dependencies:
'@unocss/core': 0.57.3
ofetch: 1.3.3
dev: true
/@unocss/preset-wind@0.57.3:
resolution: {integrity: sha512-LymBZtNK86qEpLpbH5eOAiHNFvkIAjfL+Jlok5xI/yO/GCqjnTiw1QAxu2vxLUnQlqlvu7IykOx+Hk1nNvkSaA==}
dependencies:
'@unocss/core': 0.57.3
'@unocss/preset-mini': 0.57.3
'@unocss/rule-utils': 0.57.3
dev: true
/@unocss/reset@0.57.3:
resolution: {integrity: sha512-E6Q8jucQlVLOM+d+F5DKGi/8GVc8KDwAQnbcpbrGL/1iix4IM3emRkPmujgTLWS+HIRRcWcEvT6sNwnd9r6H2A==}
dev: true
/@unocss/rule-utils@0.57.3:
resolution: {integrity: sha512-koWXeRJHFt/SJdb3m7s/2+NrBCcUtl67SX7rSHJc99Z+dwZgIsPUfdfRKM4mZD43MayybvDrd1Wue2LNQg5R/g==}
engines: {node: '>=14'}
dependencies:
'@unocss/core': 0.57.3
magic-string: 0.30.5
dev: true
/@unocss/scope@0.57.3:
resolution: {integrity: sha512-hL0Gjd5getA6ziiOvu1M2Jw5e+FnD9rzu+t+4SnxWcpP+bZtu+LBrt5FeqrizwUHfE/723iuEvg16W5hjhGLQA==}
dev: true
/@unocss/transformer-attributify-jsx-babel@0.57.3:
resolution: {integrity: sha512-b5esljHAz274tv0sXe8GmHew7FXzwkRQrod6NdR9pyFlPQ9gn7gxi0MIsvIV0U8PdSz3HOHOuT0tU/zphjaJDA==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/transformer-attributify-jsx@0.57.3:
resolution: {integrity: sha512-OgejFNN7AcCgudh/HGe2BS00TbRv7Bi+siWeUS7AEGEG+p7cQZn92XljCFZGqIyvgfVWypb6/xve9H4oY3/E+w==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/transformer-compile-class@0.57.3:
resolution: {integrity: sha512-DqmRTQujqAdk4uSrqy+t9xSVmKM9E3yW9PCwDxI1evva0/qTFexzjoR42glq8x7LSn0ZmFyflXcQoeXmwjsBrg==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/transformer-directives@0.57.3:
resolution: {integrity: sha512-GXedqnb0PB+XkjdfNEInuLxxLjPbaCQLCUhSvTcw67+kalGgX2Mn/hYwpSHmDMLe+Uld5n0vcJRu2a8chBdAwA==}
dependencies:
'@unocss/core': 0.57.3
'@unocss/rule-utils': 0.57.3
css-tree: 2.3.1
dev: true
/@unocss/transformer-variant-group@0.57.3:
resolution: {integrity: sha512-PpKtnwyb4ncjDhsTm/PtiL0RUdmaee+07W0AzSEz29IFFwyrueIP6WHmD6agKmgDPoaw5Ywebt6DdkSbnfYHzw==}
dependencies:
'@unocss/core': 0.57.3
dev: true
/@unocss/vite@0.57.3(rollup@4.3.0)(vite@4.5.0):
resolution: {integrity: sha512-SX2wtxRFLka0CgMwqokKuhaBUptj8vcpmLObVRRgV+7dSdx6GMbZcjZfQfibMKhJY3d5iSAylcfyW2JqTX2F+g==}
peerDependencies:
vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0
dependencies:
'@ampproject/remapping': 2.2.1
'@rollup/pluginutils': 5.0.5(rollup@4.3.0)
'@unocss/config': 0.57.3
'@unocss/core': 0.57.3
'@unocss/inspector': 0.57.3
'@unocss/scope': 0.57.3
'@unocss/transformer-directives': 0.57.3
chokidar: 3.5.3
fast-glob: 3.3.2
magic-string: 0.30.5
vite: 4.5.0(@types/node@20.9.0)(less@4.2.0)(terser@5.24.0)
transitivePeerDependencies:
- rollup
dev: true
/@vant/popperjs@1.3.0:
resolution: {integrity: sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw==}
dev: false
@ -3036,6 +3287,10 @@ packages:
resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
dev: true
/colorette@2.0.20:
resolution: {integrity: sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==}
dev: true
/combined-stream@1.0.8:
resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
engines: {node: '>= 0.8'}
@ -3185,6 +3440,14 @@ packages:
which: 2.0.2
dev: true
/css-tree@2.3.1:
resolution: {integrity: sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==}
engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0}
dependencies:
mdn-data: 2.0.30
source-map-js: 1.0.2
dev: true
/cssesc@3.0.0:
resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
engines: {node: '>=4'}
@ -3287,6 +3550,10 @@ packages:
engines: {node: '>=8'}
dev: true
/defu@6.1.3:
resolution: {integrity: sha512-Vy2wmG3NTkmHNg/kzpuvHhkqeIx3ODWqasgCRbKtbXEN0G+HpEEv9BtJLp7ZG1CZloFaC41Ah3ZFbq7aqCqMeQ==}
dev: true
/del@7.1.0:
resolution: {integrity: sha512-v2KyNk7efxhlyHpjEvfyxaAihKKK0nWCuf6ZtqZcFFpQRG0bJ12Qsr0RpvsICMjAAZ8DOVCxrlqpxISlMHC4Kg==}
engines: {node: '>=14.16'}
@ -3306,6 +3573,10 @@ packages:
engines: {node: '>=0.4.0'}
dev: false
/destr@2.0.2:
resolution: {integrity: sha512-65AlobnZMiCET00KaFFjUefxDX0khFA/E4myqZ7a6Sq1yZtR8+FVIvilVX66vF2uobSumxooYZChiRPCKNqhmg==}
dev: true
/detect-file@1.0.0:
resolution: {integrity: sha512-DtCOLG98P007x7wiiOmfI0fi3eIKyWiLTGJ2MDnVi/E04lWGbf+JzrRHMm0rgIIZJGtHpKpbVgLWHrv8xXpc3Q==}
engines: {node: '>=0.10.0'}
@ -3349,6 +3620,10 @@ packages:
tslib: 2.6.2
dev: true
/duplexer@0.1.2:
resolution: {integrity: sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==}
dev: true
/eastasianwidth@0.2.0:
resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
dev: true
@ -3835,6 +4110,21 @@ packages:
engines: {node: '>=0.10.0'}
dev: true
/execa@5.1.1:
resolution: {integrity: sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==}
engines: {node: '>=10'}
dependencies:
cross-spawn: 7.0.3
get-stream: 6.0.1
human-signals: 2.1.0
is-stream: 2.0.1
merge-stream: 2.0.0
npm-run-path: 4.0.1
onetime: 5.1.2
signal-exit: 3.0.7
strip-final-newline: 2.0.0
dev: true
/expand-tilde@2.0.2:
resolution: {integrity: sha512-A5EmesHW6rfnZ9ysHQjPdJRni0SRar0tjtG5MNtm9n5TUvsYU8oozprtRD4AqHxcZWWlVuAmQo2nWKfN9oyjTw==}
engines: {node: '>=0.10.0'}
@ -4125,6 +4415,11 @@ packages:
hasown: 2.0.0
dev: true
/get-stream@6.0.1:
resolution: {integrity: sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==}
engines: {node: '>=10'}
dev: true
/get-tsconfig@4.7.2:
resolution: {integrity: sha512-wuMsz4leaj5hbGgg4IvDU0bqJagpftG5l5cXIAvo8uZrqn0NJqwtfupTN00VnkQJPcIRrxYrm1Ue24btpCha2A==}
dependencies:
@ -4245,6 +4540,13 @@ packages:
resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
dev: true
/gzip-size@6.0.0:
resolution: {integrity: sha512-ax7ZYomf6jqPTQ4+XCpUGyXKHk5WweS+e05MBO4/y3WJ5RkmPXNKvX+bx1behVILVwr6JSQvZAku021CHPXG3Q==}
engines: {node: '>=10'}
dependencies:
duplexer: 0.1.2
dev: true
/handlebars@4.7.8:
resolution: {integrity: sha512-vafaFqs8MZkRrSX7sFVUdo3ap/eNiLnb4IakshzvP56X5Nr1iGKAIqdX6tMlm6HcNRIkr6AxO5jFEoJzzpT8aQ==}
engines: {node: '>=0.4.7'}
@ -4323,6 +4625,11 @@ packages:
engines: {node: '>=8'}
dev: true
/human-signals@2.1.0:
resolution: {integrity: sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==}
engines: {node: '>=10.17.0'}
dev: true
/husky@8.0.3:
resolution: {integrity: sha512-+dQSyqPh4x1hlO1swXBiNb2HzTDN1I2IGLQx1GrBuiqFJfoMrnZWwVmatvSiO+Iz8fBUnf+lekwNo4c2LlXItg==}
engines: {node: '>=14'}
@ -4634,6 +4941,11 @@ packages:
is-unc-path: 1.0.0
dev: true
/is-stream@2.0.1:
resolution: {integrity: sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==}
engines: {node: '>=8'}
dev: true
/is-unc-path@1.0.0:
resolution: {integrity: sha512-mrGpVd0fs7WWLfVsStvgF6iEJnbjDFZh9/emhRDcGWTduTfNHd9CHeUwH3gYIjdbwo4On6hunkztwOaAw0yllQ==}
engines: {node: '>=0.10.0'}
@ -4690,7 +5002,6 @@ packages:
hasBin: true
requiresBuild: true
dev: true
optional: true
/js-tokens@4.0.0:
resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
@ -4791,6 +5102,10 @@ packages:
engines: {node: '>=0.10.0'}
dev: true
/kolorist@1.8.0:
resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==}
dev: true
/less@4.2.0:
resolution: {integrity: sha512-P3b3HJDBtSzsXUl0im2L7gTO5Ubg8mEN6G8qoTS77iXxXX4Hvu4Qj540PZDvQ8V6DmX6iXo98k7Md0Cm1PrLaA==}
engines: {node: '>=6'}
@ -5043,6 +5358,14 @@ packages:
resolution: {integrity: sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==}
dev: true
/mdn-data@2.0.30:
resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==}
dev: true
/merge-stream@2.0.0:
resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
dev: true
/merge2@1.4.1:
resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
engines: {node: '>= 8'}
@ -5154,6 +5477,11 @@ packages:
commander: 11.1.0
dev: true
/mrmime@1.0.1:
resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
engines: {node: '>=10'}
dev: true
/ms@2.1.2:
resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
dev: true
@ -5222,6 +5550,10 @@ packages:
tslib: 2.6.2
dev: true
/node-fetch-native@1.4.1:
resolution: {integrity: sha512-NsXBU0UgBxo2rQLOeWNZqS3fvflWePMECr8CoSWoSTqCqGbVVsvl9vZu1HfQicYN0g5piV9Gh8RTEvo/uP752w==}
dev: true
/node-plop@0.32.0:
resolution: {integrity: sha512-lKFSRSRuDHhwDKMUobdsvaWCbbDRbV3jMUSMiajQSQux1aNUevAZVxUHc2JERI//W8ABPRbi3ebYuSuIzkNIpQ==}
engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
@ -5264,6 +5596,13 @@ packages:
engines: {node: '>=0.10.0'}
dev: true
/npm-run-path@4.0.1:
resolution: {integrity: sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==}
engines: {node: '>=8'}
dependencies:
path-key: 3.1.1
dev: true
/nprogress@0.2.0:
resolution: {integrity: sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==}
dev: false
@ -5299,6 +5638,14 @@ packages:
isobject: 3.0.1
dev: true
/ofetch@1.3.3:
resolution: {integrity: sha512-s1ZCMmQWXy4b5K/TW9i/DtiN8Ku+xCiHcjQ6/J/nDdssirrQNOoB165Zu8EqLMA2lln1JUth9a0aW9Ap2ctrUg==}
dependencies:
destr: 2.0.2
node-fetch-native: 1.4.1
ufo: 1.3.1
dev: true
/once@1.4.0:
resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
dependencies:
@ -5607,6 +5954,10 @@ packages:
resolution: {integrity: sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==}
dev: true
/perfect-debounce@1.0.0:
resolution: {integrity: sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==}
dev: true
/picocolors@1.0.0:
resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
@ -5628,6 +5979,7 @@ packages:
/pify@4.0.1:
resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
engines: {node: '>=6'}
requiresBuild: true
dev: true
/pinia-plugin-persistedstate@3.2.0(pinia@2.1.7):
@ -6000,7 +6352,7 @@ packages:
engines: {node: '>=14'}
hasBin: true
peerDependencies:
rollup: 2.x || 3.x
rollup: 2.x || 3.x || ^4.x
peerDependenciesMeta:
rollup:
optional: true
@ -6169,6 +6521,15 @@ packages:
pkg-conf: 2.1.0
dev: true
/sirv@2.0.3:
resolution: {integrity: sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==}
engines: {node: '>= 10'}
dependencies:
'@polka/url': 1.0.0-next.23
mrmime: 1.0.1
totalist: 3.0.1
dev: true
/slash2@2.0.0:
resolution: {integrity: sha512-7ElvBydJPi3MHU/KEOblFSbO/skl4Z69jKkFCpYIYVOMSIZsKi4gYU43HGeZPmjxCXrHekoDAAewphPQNnsqtA==}
engines: {node: '>=6'}
@ -6323,6 +6684,11 @@ packages:
engines: {node: '>=8'}
dev: true
/strip-final-newline@2.0.0:
resolution: {integrity: sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==}
engines: {node: '>=6'}
dev: true
/strip-indent@3.0.0:
resolution: {integrity: sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==}
engines: {node: '>=8'}
@ -6430,6 +6796,11 @@ packages:
is-number: 7.0.0
dev: true
/totalist@3.0.1:
resolution: {integrity: sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==}
engines: {node: '>=6'}
dev: true
/ts-api-utils@1.0.3(typescript@5.2.2):
resolution: {integrity: sha512-wNMeqtMz5NtwpT/UZGY5alT+VoKdSsOOP/kqHFcUW1P/VRhH2wJ48+DN2WwUliNbQ976ETwDL0Ifd2VVvgonvg==}
engines: {node: '>=16.13.0'}
@ -6501,6 +6872,15 @@ packages:
engines: {node: '>=0.10.0'}
dev: true
/unconfig@0.3.11:
resolution: {integrity: sha512-bV/nqePAKv71v3HdVUn6UefbsDKQWRX+bJIkiSm0+twIds6WiD2bJLWWT3i214+J/B4edufZpG2w7Y63Vbwxow==}
dependencies:
'@antfu/utils': 0.7.6
defu: 6.1.3
jiti: 1.21.0
mlly: 1.4.2
dev: true
/undici-types@5.26.5:
resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
dev: true
@ -6557,6 +6937,45 @@ packages:
engines: {node: '>= 10.0.0'}
dev: true
/unocss@0.57.3(rollup@4.3.0)(vite@4.5.0):
resolution: {integrity: sha512-reIvKa1sG9bwRZ6oGwj8p2XZSmT5On/NEisqkxsk1vTV5ZHIagbilG3aNMb5vNcI7MhRb4dy0Z4cvyNGd3194Q==}
engines: {node: '>=14'}
peerDependencies:
'@unocss/webpack': 0.57.3
vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0
peerDependenciesMeta:
'@unocss/webpack':
optional: true
vite:
optional: true
dependencies:
'@unocss/astro': 0.57.3(rollup@4.3.0)(vite@4.5.0)
'@unocss/cli': 0.57.3(rollup@4.3.0)
'@unocss/core': 0.57.3
'@unocss/extractor-arbitrary-variants': 0.57.3
'@unocss/postcss': 0.57.3
'@unocss/preset-attributify': 0.57.3
'@unocss/preset-icons': 0.57.3
'@unocss/preset-mini': 0.57.3
'@unocss/preset-tagify': 0.57.3
'@unocss/preset-typography': 0.57.3
'@unocss/preset-uno': 0.57.3
'@unocss/preset-web-fonts': 0.57.3
'@unocss/preset-wind': 0.57.3
'@unocss/reset': 0.57.3
'@unocss/transformer-attributify-jsx': 0.57.3
'@unocss/transformer-attributify-jsx-babel': 0.57.3
'@unocss/transformer-compile-class': 0.57.3
'@unocss/transformer-directives': 0.57.3
'@unocss/transformer-variant-group': 0.57.3
'@unocss/vite': 0.57.3(rollup@4.3.0)(vite@4.5.0)
vite: 4.5.0(@types/node@20.9.0)(less@4.2.0)(terser@5.24.0)
transitivePeerDependencies:
- postcss
- rollup
- supports-color
dev: true
/unplugin-auto-import@0.16.7(rollup@4.3.0):
resolution: {integrity: sha512-w7XmnRlchq6YUFJVFGSvG1T/6j8GrdYN6Em9Wf0Ye+HXgD/22kont+WnuCAA0UaUoxtuvRR1u/mXKy63g/hfqQ==}
engines: {node: '>=14'}

View File

@ -5,6 +5,8 @@ import { createRouterScroller } from 'vue-router-better-scroller'
import App from './App.vue'
import router from './router'
import 'virtual:uno.css'
import './app.less'
// Vant 桌面端适配

View File

@ -7,6 +7,7 @@ import 'nprogress/nprogress.css'
import mian from '@/views/index.vue'
import mock from '@/views/mock/index.vue'
import charts from '@/views/charts/index.vue'
import unocss from '@/views/unocss/index.vue'
NProgress.configure({ showSpinner: true, parent: '#app' })
@ -27,6 +28,11 @@ const routes = [
name: 'charts',
component: charts,
},
{
path: '/unocss',
name: 'unocss',
component: unocss,
},
]
// 创建路由实例并传递 `routes` 配置

View File

@ -63,7 +63,7 @@ const onClickLeft = () => history.back()
</script>
<template>
<VanNavBar title="📊 charts" left-arrow fixed @click-left="onClickLeft" />
<VanNavBar title="📊 Echarts" left-arrow fixed @click-left="onClickLeft" />
<div class="container">
<div class="chart">

View File

@ -21,16 +21,19 @@ watch(checked, (val) => {
<template>
<div class="container">
<div class="logo" />
<VanCellGroup title="一个集成最新技术栈、完整干净的移动端模板" inset>
<VanCell center title="🌗 暗黑模式">
<template #right-icon>
<VanSwitch v-model="checked" size="18px" />
<VanSwitch v-model="checked" size="23px" />
</template>
</VanCell>
<VanCell title="💿 mock 指南" to="mock" is-link />
<VanCell title="💿 Mock 指南" to="mock" is-link />
<VanCell title="📊 charts 演示" to="charts" is-link />
<VanCell title="📊 Echarts 演示" to="charts" is-link />
<VanCell title="🪶 Unocss 示例" to="unocss" is-link />
<VanCell center>
<template #title>

View File

@ -17,7 +17,7 @@ const onClickLeft = () => history.back()
</script>
<template>
<VanNavBar title="💿 mock 指南" left-arrow fixed @click-left="onClickLeft" />
<VanNavBar title="💿 Mock 指南" left-arrow fixed @click-left="onClickLeft" />
<div class="container">
<div class="data-label">

View File

@ -0,0 +1,12 @@
<script setup lang="ts">
// back
const onClickLeft = () => history.back()
</script>
<template>
<VanNavBar title="🪶 Unocss" left-arrow fixed @click-left="onClickLeft" />
<div class="w-full h-100vh py-60 px-20">
<span class="color-pink font-semibold"> Unocss </span>示例WIP...
</div>
</template>

19
uno.config.ts Normal file
View File

@ -0,0 +1,19 @@
import { defineConfig, presetAttributify, presetUno } from 'unocss'
import presetRemToPx from '@unocss/preset-rem-to-px'
// 刚使用unocss的朋友可以借助这个工具 https://to-unocss.netlify.app
export default defineConfig({
presets: [
presetUno,
presetAttributify,
// 为什么要用到这个插件?
// 模板使用 viewport 作为移动端适配方案unocss 默认单位为 rem
// 所以需要转成 px然后由 postcss 把 px 转成 vw/vh完成适配
presetRemToPx({
// 这里为什么要设置基础字体大小?看下面这篇文章
// https://juejin.cn/post/7262975395620618298
baseFontSize: 4,
}),
],
})

View File

@ -16,6 +16,7 @@ import viewport from 'postcss-mobile-forever'
import autoprefixer from 'autoprefixer'
import { viteVConsole } from 'vite-plugin-vconsole'
import UnoCSS from 'unocss/vite'
import mock from './build/mock/createMockServer'
export default ({ command, mode }: ConfigEnv): UserConfig => {
@ -25,6 +26,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
return {
base: env.VITE_APP_PUBLIC_PATH,
// 兼容 Cli
define: {
'process.env.VUE_APP_API_BASE_URL': JSON.stringify(env.VITE_APP_API_BASE_URL),
'process.env.VUE_APP_PUBLIC_PATH': JSON.stringify(env.VITE_APP_PUBLIC_PATH),
@ -34,6 +36,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
vue(),
vueJsx(),
visualizer(),
UnoCSS(),
legacy({
targets: ['defaults', 'not IE 11'],