diff --git a/.npmrc b/.npmrc index 4420dc8..2420005 100644 --- a/.npmrc +++ b/.npmrc @@ -1,3 +1,3 @@ registry=https://npm-cf-proxy.oo1.dev -use-node-version=20.16.0 +use-node-version=20.17.0 shamefully-hoist=true diff --git a/components.d.ts b/components.d.ts index 25f8f39..552104d 100644 --- a/components.d.ts +++ b/components.d.ts @@ -8,6 +8,9 @@ export {} declare module 'vue' { export interface GlobalComponents { DefineRender: typeof import('./src/components/vue-macros/DefineRender.vue')['default'] + ICarbonFaceCool: typeof import('~icons/carbon/face-cool')['default'] + Icons: typeof import('./src/components/Icons.vue')['default'] + ISvgPacman: typeof import('~icons/svg/pacman')['default'] ReactivityTransform: typeof import('./src/components/vue-macros/ReactivityTransform.vue')['default'] ReusableTemplate: typeof import('./src/components/ReusableTemplate.vue')['default'] RouterLink: typeof import('vue-router')['RouterLink'] diff --git a/package.json b/package.json index 08049bb..a231eba 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "vue-router": "^4.4.3" }, "devDependencies": { + "@iconify-json/carbon": "^1.1.37", "@iconify/utils": "^2.1.32", "@rushstack/eslint-patch": "^1.10.4", "@tsconfig/node20": "^20.1.4", @@ -70,6 +71,7 @@ "typescript": "~5.5.4", "unocss": "^0.62.3", "unplugin-auto-import": "^0.18.2", + "unplugin-icons": "^0.19.2", "unplugin-vue-components": "^0.27.4", "unplugin-vue-macros": "^2.11.6", "unplugin-vue-markdown": "^0.26.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index baf3d15..53c5fe0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -80,6 +80,9 @@ importers: specifier: ^4.4.3 version: 4.4.3(patch_hash=srtmpgmwmi3z5x3wdppdguh7mi)(vue@3.4.38(typescript@5.5.4)) devDependencies: + '@iconify-json/carbon': + specifier: ^1.1.37 + version: 1.1.37 '@iconify/utils': specifier: ^2.1.32 version: 2.1.32 @@ -173,6 +176,9 @@ importers: unplugin-auto-import: specifier: ^0.18.2 version: 0.18.2(@vueuse/core@10.7.0(vue@3.4.38(typescript@5.5.4)))(rollup@4.21.0) + unplugin-icons: + specifier: ^0.19.2 + version: 0.19.2(@vue/compiler-sfc@3.4.38) unplugin-vue-components: specifier: ^0.27.4 version: 0.27.4(@babel/parser@7.25.4)(rollup@4.21.0)(vue@3.4.38(typescript@5.5.4)) @@ -216,6 +222,9 @@ packages: resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==, tarball: https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz} engines: {node: '>=6.0.0'} + '@antfu/install-pkg@0.3.5': + resolution: {integrity: sha512-HwIACY0IzrM7FGafMbWZOqEDBSfCwPcylu+GacaRcxJm4Yvvuh3Dy2vZwqdJAzXponc6aLO9FaH4l75pq8/ZSA==, tarball: https://registry.npmjs.org/@antfu/install-pkg/-/install-pkg-0.3.5.tgz} + '@antfu/install-pkg@0.4.0': resolution: {integrity: sha512-vI73C0pFA9L+5v+djh0WSLXb8qYQGH5fX8nczaFe1OTI/8Fh03JS1Mov1V7urb6P3A2cBlBqZNjJIKv54+zVRw==, tarball: https://registry.npmjs.org/@antfu/install-pkg/-/install-pkg-0.4.0.tgz} @@ -699,6 +708,9 @@ packages: resolution: {integrity: sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==, tarball: https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.3.tgz} deprecated: Use @eslint/object-schema instead + '@iconify-json/carbon@1.1.37': + resolution: {integrity: sha512-Hj9oZtRmN63yt29YovqgqOJQhaoVMNMTkFLT3HKAJm4HjvI405Juez5UfdysYmLjF708U7gJNx4U6K1k5+fTBw==, tarball: https://registry.npmjs.org/@iconify-json/carbon/-/carbon-1.1.37.tgz} + '@iconify/types@2.0.0': resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==, tarball: https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz} @@ -727,6 +739,10 @@ packages: '@jridgewell/trace-mapping@0.3.25': resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==, tarball: https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz} + '@jsdevtools/ez-spawn@3.0.4': + resolution: {integrity: sha512-f5DRIOZf7wxogefH03RjMPMdBF7ADTWUMoOs9kaJo06EfwF+aFhMZMDZxHg/Xe12hptN9xoZjGso2fdjapBRIA==, tarball: https://registry.npmjs.org/@jsdevtools/ez-spawn/-/ez-spawn-3.0.4.tgz} + engines: {node: '>=10'} + '@mdit-vue/plugin-component@2.1.3': resolution: {integrity: sha512-9AG17beCgpEw/4ldo/M6Y/1Rh4E1bqMmr/rCkWKmCAxy9tJz3lzY7HQJanyHMJufwsb3WL5Lp7Om/aPcQTZ9SA==, tarball: https://registry.npmjs.org/@mdit-vue/plugin-component/-/plugin-component-2.1.3.tgz} @@ -1505,6 +1521,9 @@ packages: resolution: {integrity: sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==, tarball: https://registry.npmjs.org/cac/-/cac-6.7.14.tgz} engines: {node: '>=8'} + call-me-maybe@1.0.2: + resolution: {integrity: sha512-HpX65o1Hnr9HH25ojC1YGs7HCQLq0GCOibSaWER0eNpgJ/Z1MZv2mTc7+xh6WOPxbRVcmgbv4hGU+uSQ/2xFZQ==, tarball: https://registry.npmjs.org/call-me-maybe/-/call-me-maybe-1.0.2.tgz} + callsites@3.1.0: resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==, tarball: https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz} engines: {node: '>=6'} @@ -2881,6 +2900,10 @@ packages: resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==, tarball: https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz} engines: {node: '>= 0.8.0'} + type-detect@4.1.0: + resolution: {integrity: sha512-Acylog8/luQ8L7il+geoSxhEkazvkslg7PSNKOX59mbB9cOveP5aq9h74Y7YU8yDpJwetzQQrfIwtf4Wp4LKcw==, tarball: https://registry.npmjs.org/type-detect/-/type-detect-4.1.0.tgz} + engines: {node: '>=4'} + type-fest@0.20.2: resolution: {integrity: sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==, tarball: https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz} engines: {node: '>=10'} @@ -2964,6 +2987,26 @@ packages: webpack: optional: true + unplugin-icons@0.19.2: + resolution: {integrity: sha512-QkQJ/Iz3PFr/EoiOvFUQYvqbbJZ7Vs3hObKAFHh5eywTU1PQagSNeXKGRD+JpzXSTnUNLtG0u/xEA5Ec2OeANQ==, tarball: https://registry.npmjs.org/unplugin-icons/-/unplugin-icons-0.19.2.tgz} + peerDependencies: + '@svgr/core': '>=7.0.0' + '@svgx/core': ^1.0.1 + '@vue/compiler-sfc': ^3.0.2 || ^2.7.0 + vue-template-compiler: ^2.6.12 + vue-template-es2015-compiler: ^1.9.0 + peerDependenciesMeta: + '@svgr/core': + optional: true + '@svgx/core': + optional: true + '@vue/compiler-sfc': + optional: true + vue-template-compiler: + optional: true + vue-template-es2015-compiler: + optional: true + unplugin-vue-components@0.27.4: resolution: {integrity: sha512-1XVl5iXG7P1UrOMnaj2ogYa5YTq8aoh5jwDPQhemwO/OrXW+lPQKDXd1hMz15qxQPxgb/XXlbgo3HQ2rLEbmXQ==, tarball: https://registry.npmjs.org/unplugin-vue-components/-/unplugin-vue-components-0.27.4.tgz} engines: {node: '>=14'} @@ -3284,6 +3327,10 @@ snapshots: '@jridgewell/gen-mapping': 0.3.5 '@jridgewell/trace-mapping': 0.3.25 + '@antfu/install-pkg@0.3.5': + dependencies: + '@jsdevtools/ez-spawn': 3.0.4 + '@antfu/install-pkg@0.4.0': dependencies: package-manager-detector: 0.1.2 @@ -3698,6 +3745,10 @@ snapshots: '@humanwhocodes/object-schema@2.0.3': {} + '@iconify-json/carbon@1.1.37': + dependencies: + '@iconify/types': 2.0.0 + '@iconify/types@2.0.0': {} '@iconify/utils@2.1.32': @@ -3738,6 +3789,13 @@ snapshots: '@jridgewell/resolve-uri': 3.1.2 '@jridgewell/sourcemap-codec': 1.5.0 + '@jsdevtools/ez-spawn@3.0.4': + dependencies: + call-me-maybe: 1.0.2 + cross-spawn: 7.0.3 + string-argv: 0.3.2 + type-detect: 4.1.0 + '@mdit-vue/plugin-component@2.1.3': dependencies: '@types/markdown-it': 14.1.2 @@ -4770,6 +4828,8 @@ snapshots: cac@6.7.14: {} + call-me-maybe@1.0.2: {} + callsites@3.1.0: {} camelcase@6.3.0: {} @@ -6136,6 +6196,8 @@ snapshots: dependencies: prelude-ls: 1.2.1 + type-detect@4.1.0: {} + type-fest@0.20.2: {} typescript@5.5.4: {} @@ -6236,6 +6298,20 @@ snapshots: rollup: 4.21.0 vite: 5.4.2(@types/node@22.5.0)(less@4.2.0) + unplugin-icons@0.19.2(@vue/compiler-sfc@3.4.38): + dependencies: + '@antfu/install-pkg': 0.3.5 + '@antfu/utils': 0.7.10 + '@iconify/utils': 2.1.32 + debug: 4.3.6 + kolorist: 1.8.0 + local-pkg: 0.5.0 + unplugin: 1.12.2 + optionalDependencies: + '@vue/compiler-sfc': 3.4.38 + transitivePeerDependencies: + - supports-color + unplugin-vue-components@0.27.4(@babel/parser@7.25.4)(rollup@4.21.0)(vue@3.4.38(typescript@5.5.4)): dependencies: '@antfu/utils': 0.7.10 diff --git a/src/assets/icons/svgs/pacman.svg b/src/assets/icons/svgs/pacman.svg new file mode 100644 index 0000000..03c1f90 --- /dev/null +++ b/src/assets/icons/svgs/pacman.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/Icons.vue b/src/components/Icons.vue new file mode 100644 index 0000000..9e657b1 --- /dev/null +++ b/src/components/Icons.vue @@ -0,0 +1,29 @@ + + + diff --git a/src/main.ts b/src/main.ts index 8c37263..2016855 100644 --- a/src/main.ts +++ b/src/main.ts @@ -19,7 +19,7 @@ async function init() { transparency: 0.9, }, }); - eruda.show(); + // eruda.show(); }); } diff --git a/src/pages/index-page.vue b/src/pages/index-page.vue index 843d056..a266bcd 100644 --- a/src/pages/index-page.vue +++ b/src/pages/index-page.vue @@ -46,4 +46,5 @@ const FComponent: FunctionalComponent<{ prop: string }> = (props, context) => (
+ diff --git a/unocss.config.ts b/unocss.config.ts index 36cb41a..1351e94 100644 --- a/unocss.config.ts +++ b/unocss.config.ts @@ -18,6 +18,7 @@ export default defineConfig({ }, ], presets: [ + // TODO: https://github.dev/antfu-collective/vitesse/tree/main/src/components presetUno({ /* prefix: "u-", */ }), @@ -33,6 +34,7 @@ export default defineConfig({ display: "inline-block", "vertical-align": "middle", },*/ + cdn: 'https://esm.sh/', customizations: { iconCustomizer(collection, icon, props) { props.width = '1em'; @@ -40,13 +42,13 @@ export default defineConfig({ }, }, collections: { - icon: FileSystemIconLoader('src/assets/uno-svg', (svg) => { - // width="200px" height="200.00px" + icon: FileSystemIconLoader('src/assets/icons/svgs', (svg) => { return svg.replace(/#000000|#000/g, 'currentColor'); }), + carbon: () => import('@iconify-json/carbon/icons.json').then((i) => i.default), }, warn: true, - }), + }), // https://unocss.dev/presets/icons ], transformers: [ //https://unocss.dev/transformers/variant-group diff --git a/vite.config.ts b/vite.config.ts index 847f52c..0d15602 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -9,6 +9,9 @@ import { pinyin } from 'pinyin-pro'; import type { OutputOptions } from 'rollup'; import UnoCSS from 'unocss/vite'; import AutoImport from 'unplugin-auto-import/vite'; +import { FileSystemIconLoader } from 'unplugin-icons/loaders'; +import IconsResolver from 'unplugin-icons/resolver'; +import Icons from 'unplugin-icons/vite'; import { TDesignResolver } from 'unplugin-vue-components/resolvers'; import Components from 'unplugin-vue-components/vite'; import VueMacros from 'unplugin-vue-macros/vite'; @@ -126,15 +129,22 @@ function Plugins() { // allow auto import and register components used in markdown include: [/\.vue$/, /\.vue\?vue/, /\.md$/], resolvers: [ - TDesignResolver({ - library: 'mobile-vue', - esm: true, - }), - VantResolver({ - importStyle: true, - }), + IconsResolver({ + customCollections: ['svg'], + }), // https://github.com/unplugin/unplugin-icons?tab=readme-ov-file#auto-importing + TDesignResolver({ library: 'mobile-vue', esm: true }), + VantResolver({ importStyle: true }), ], }), + Icons({ + compiler: 'vue3', + autoInstall: true, + customCollections: { + svg: FileSystemIconLoader('src/assets/icons/svgs', (svg) => { + return svg.replace(/^