From f3466cc02409ca4775c8d30e869b2c145a7c452a Mon Sep 17 00:00:00 2001 From: GuoJikun Date: Sun, 26 May 2024 12:27:21 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BC=98=E5=8C=96=E4=BA=8B?= =?UTF-8?q?=E4=BB=B6=E7=9A=84ts=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 + pnpm-lock.yaml | 93 +++++++++++++++++--- src/components/preview-image/src/switch.vue | 4 +- src/components/preview-image/src/toolbar.vue | 2 +- 4 files changed, 84 insertions(+), 17 deletions(-) diff --git a/package.json b/package.json index 91e4c34..1b7d91c 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,7 @@ "name": "fox-preview-image", "description": "一个支持 vue3 的预览图片组件", "version": "3.0.0", + "type": "module", "main": "lib/preview-image.js", "module": "lib/preview-image.mjs", "browser": "lib/preview-image.js", @@ -60,6 +61,7 @@ "jsdom": "^24.0.0", "npm-run-all2": "^6.1.2", "prettier": "^3.2.5", + "sass": "^1.77.2", "typescript": "~5.4.0", "vite": "^5.2.8", "vite-plugin-vue-devtools": "^7.0.25", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 966274c..3b01308 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -58,18 +58,21 @@ devDependencies: prettier: specifier: ^3.2.5 version: 3.2.5 + sass: + specifier: ^1.77.2 + version: 1.77.2 typescript: specifier: ~5.4.0 version: 5.4.5 vite: specifier: ^5.2.8 - version: 5.2.11(@types/node@20.12.12) + version: 5.2.11(@types/node@20.12.12)(sass@1.77.2) vite-plugin-vue-devtools: specifier: ^7.0.25 version: 7.2.1(vite@5.2.11)(vue@3.4.27) vitest: specifier: ^1.4.0 - version: 1.6.0(@types/node@20.12.12)(jsdom@24.0.0) + version: 1.6.0(@types/node@20.12.12)(jsdom@24.0.0)(sass@1.77.2) vue-tsc: specifier: ^2.0.11 version: 2.0.19(typescript@5.4.5) @@ -1091,7 +1094,7 @@ packages: '@babel/core': 7.24.6 '@babel/plugin-transform-typescript': 7.24.6(@babel/core@7.24.6) '@vue/babel-plugin-jsx': 1.2.2(@babel/core@7.24.6) - vite: 5.2.11(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) vue: 3.4.27(typescript@5.4.5) transitivePeerDependencies: - supports-color @@ -1104,7 +1107,7 @@ packages: vite: ^5.0.0 vue: ^3.2.25 dependencies: - vite: 5.2.11(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) vue: 3.4.27(typescript@5.4.5) dev: true @@ -1469,6 +1472,14 @@ packages: engines: {node: '>=12'} dev: true + /anymatch@3.1.3: + resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==} + engines: {node: '>= 8'} + dependencies: + normalize-path: 3.0.0 + picomatch: 2.3.1 + dev: true + /argparse@2.0.1: resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==} dev: true @@ -1490,6 +1501,11 @@ packages: resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} dev: true + /binary-extensions@2.3.0: + resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==} + engines: {node: '>=8'} + dev: true + /boolbase@1.0.0: resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==} dev: true @@ -1587,6 +1603,21 @@ packages: get-func-name: 2.0.2 dev: true + /chokidar@3.6.0: + resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==} + engines: {node: '>= 8.10.0'} + dependencies: + anymatch: 3.1.3 + braces: 3.0.3 + glob-parent: 5.1.2 + is-binary-path: 2.1.0 + is-glob: 4.0.3 + normalize-path: 3.0.0 + readdirp: 3.6.0 + optionalDependencies: + fsevents: 2.3.3 + dev: true + /color-convert@1.9.3: resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==} dependencies: @@ -2254,6 +2285,10 @@ packages: engines: {node: '>= 4'} dev: true + /immutable@4.3.6: + resolution: {integrity: sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ==} + dev: true + /import-fresh@3.3.0: resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==} engines: {node: '>=6'} @@ -2283,6 +2318,13 @@ packages: resolution: {integrity: sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==} dev: true + /is-binary-path@2.1.0: + resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==} + engines: {node: '>=8'} + dependencies: + binary-extensions: 2.3.0 + dev: true + /is-docker@3.0.0: resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==} engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} @@ -2632,6 +2674,11 @@ packages: abbrev: 2.0.0 dev: true + /normalize-path@3.0.0: + resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==} + engines: {node: '>=0.10.0'} + dev: true + /npm-normalize-package-bin@3.0.1: resolution: {integrity: sha512-dMxCf+zZ+3zeQZXKxmyuCKlIDPGuv8EF940xbkC4kQVDTtqoh6rJFO+JTKSA6/Rwi0getWmtuy4Itup0AMcaDQ==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} @@ -2884,6 +2931,13 @@ packages: npm-normalize-package-bin: 3.0.1 dev: true + /readdirp@3.6.0: + resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==} + engines: {node: '>=8.10.0'} + dependencies: + picomatch: 2.3.1 + dev: true + /requires-port@1.0.0: resolution: {integrity: sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==} dev: true @@ -2955,6 +3009,16 @@ packages: resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==} dev: true + /sass@1.77.2: + resolution: {integrity: sha512-eb4GZt1C3avsX3heBNlrc7I09nyT00IUuo4eFhAbeXWU2fvA7oXI53SxODVAA+zgZCk9aunAZgO+losjR3fAwA==} + engines: {node: '>=14.0.0'} + hasBin: true + dependencies: + chokidar: 3.6.0 + immutable: 4.3.6 + source-map-js: 1.2.0 + dev: true + /saxes@6.0.0: resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==} engines: {node: '>=v12.22.7'} @@ -3244,10 +3308,10 @@ packages: peerDependencies: vite: ^2.6.0 || ^3.0.0 || ^4.0.0 || ^5.0.0-0 dependencies: - vite: 5.2.11(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) dev: true - /vite-node@1.6.0(@types/node@20.12.12): + /vite-node@1.6.0(@types/node@20.12.12)(sass@1.77.2): resolution: {integrity: sha512-de6HJgzC+TFzOu0NTC4RAIsyf/DY/ibWDYQUcuEA84EMHhcefTUGkjFHKKEJhQN4A+6I0u++kr3l36ZF2d7XRw==} engines: {node: ^18.0.0 || >=20.0.0} hasBin: true @@ -3256,7 +3320,7 @@ packages: debug: 4.3.4 pathe: 1.1.2 picocolors: 1.0.1 - vite: 5.2.11(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) transitivePeerDependencies: - '@types/node' - less @@ -3287,7 +3351,7 @@ packages: perfect-debounce: 1.0.0 picocolors: 1.0.1 sirv: 2.0.4 - vite: 5.2.11(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) transitivePeerDependencies: - rollup - supports-color @@ -3304,7 +3368,7 @@ packages: '@vue/devtools-shared': 7.2.1 execa: 8.0.1 sirv: 2.0.4 - vite: 5.2.11(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) vite-plugin-inspect: 0.8.4(vite@5.2.11) vite-plugin-vue-inspector: 5.1.2(vite@5.2.11) transitivePeerDependencies: @@ -3328,12 +3392,12 @@ packages: '@vue/compiler-dom': 3.4.27 kolorist: 1.8.0 magic-string: 0.30.10 - vite: 5.2.11(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) transitivePeerDependencies: - supports-color dev: true - /vite@5.2.11(@types/node@20.12.12): + /vite@5.2.11(@types/node@20.12.12)(sass@1.77.2): resolution: {integrity: sha512-HndV31LWW05i1BLPMUCE1B9E9GFbOu1MbenhS58FuK6owSO5qHm7GiCotrNY1YE5rMeQSFBGmT5ZaLEjFizgiQ==} engines: {node: ^18.0.0 || >=20.0.0} hasBin: true @@ -3365,11 +3429,12 @@ packages: esbuild: 0.20.2 postcss: 8.4.38 rollup: 4.18.0 + sass: 1.77.2 optionalDependencies: fsevents: 2.3.3 dev: true - /vitest@1.6.0(@types/node@20.12.12)(jsdom@24.0.0): + /vitest@1.6.0(@types/node@20.12.12)(jsdom@24.0.0)(sass@1.77.2): resolution: {integrity: sha512-H5r/dN06swuFnzNFhq/dnz37bPXnq8xB2xB5JOVk8K09rUtoeNN+LHWkoQ0A/i3hvbUKKcCei9KpbxqHMLhLLA==} engines: {node: ^18.0.0 || >=20.0.0} hasBin: true @@ -3413,8 +3478,8 @@ packages: strip-literal: 2.1.0 tinybench: 2.8.0 tinypool: 0.8.4 - vite: 5.2.11(@types/node@20.12.12) - vite-node: 1.6.0(@types/node@20.12.12) + vite: 5.2.11(@types/node@20.12.12)(sass@1.77.2) + vite-node: 1.6.0(@types/node@20.12.12)(sass@1.77.2) why-is-node-running: 2.2.2 transitivePeerDependencies: - less diff --git a/src/components/preview-image/src/switch.vue b/src/components/preview-image/src/switch.vue index 479aee5..6343892 100644 --- a/src/components/preview-image/src/switch.vue +++ b/src/components/preview-image/src/switch.vue @@ -2,8 +2,8 @@ import ArrowRight from '@/components/arrow-right.vue' const emit = defineEmits<{ - (e: 'prev'): void - (e: 'next'): void + prev: [] + next: [] }>() const handlePrevClick = () => { diff --git a/src/components/preview-image/src/toolbar.vue b/src/components/preview-image/src/toolbar.vue index 026366b..b93b229 100644 --- a/src/components/preview-image/src/toolbar.vue +++ b/src/components/preview-image/src/toolbar.vue @@ -15,7 +15,7 @@ const props = withDefaults(defineProps(), { index: '1/1' }) -const emit = defineEmits(['click']) +const emit = defineEmits<{ click: [type: OperateType]}>() type OperateType = 'zoom-out' | 'zoom-in' | 'contraRotate' | 'clockwiseRotation' | 'download'