Use nuxt icon instead of iconify json

2024-08-04 11:18:28 +02:00
parent 324649d6d6
commit 811cbb6752
7 changed files with 68 additions and 46 deletions
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -2,6 +2,7 @@ export default defineNuxtConfig({
 	modules: [
 		"@vueuse/nuxt",
 		"@unocss/nuxt",
+		"@nuxt/icon",
 		"nuxt-svgo",
 		"@nuxt/eslint"
 	],
@@ -50,11 +51,6 @@ export default defineNuxtConfig({
 			}
 		}
 	},
-	vue: {
-		compilerOptions: {
-			isCustomElement: (tag: string) => tag.startsWith("i-")
-		}
-	},
 	srcDir: "src/",
 	ssr: false,
 	devServer: {
--- a/package.json
+++ b/package.json
@@ -31,8 +31,8 @@
 	},
 	"devDependencies": {
 		"@antfu/eslint-config": "^2.24.1",
-		"@iconify-json/heroicons-solid": "^1.1.11",
 		"@nuxt/eslint": "^0.4.0",
+		"@nuxt/icon": "^1.4.5",
 		"@tauri-apps/cli": ">=2.0.0-rc.1",
 		"@unocss/eslint-plugin": "^0.61.9",
 		"@unocss/nuxt": "^0.61.9",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -27,12 +27,12 @@ importers:
      '@antfu/eslint-config':
        specifier: ^2.24.1
        version: 2.24.1(@unocss/eslint-plugin@0.61.9(eslint@8.57.0)(typescript@5.5.4))(@vue/compiler-sfc@3.4.35)(eslint-plugin-format@0.1.0(eslint@8.57.0))(eslint@8.57.0)(typescript@5.5.4)
-      '@iconify-json/heroicons-solid':
-        specifier: ^1.1.11
-        version: 1.1.11
      '@nuxt/eslint':
        specifier: ^0.4.0
        version: 0.4.0(eslint@8.57.0)(magicast@0.3.4)(rollup@4.18.0)(typescript@5.5.4)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))
+      '@nuxt/icon':
+        specifier: ^1.4.5
+        version: 1.4.5(magicast@0.3.4)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))(vue@3.4.35(typescript@5.5.4))
      '@tauri-apps/cli':
        specifier: '>=2.0.0-rc.1'
        version: 2.0.0-rc.1
@@ -41,7 +41,7 @@ importers:
        version: 0.61.9(eslint@8.57.0)(typescript@5.5.4)
      '@unocss/nuxt':
        specifier: ^0.61.9
-        version: 0.61.9(magicast@0.3.4)(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))(webpack@5.91.0(esbuild@0.21.5))
+        version: 0.61.9(magicast@0.3.4)(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))(webpack@5.91.0(esbuild@0.23.0))
      '@vueuse/core':
        specifier: ^10.11.0
        version: 10.11.0(vue@3.4.35(typescript@5.5.4))
@@ -963,8 +963,8 @@ packages:
  '@humanwhocodes/object-schema@2.0.3':
    resolution: {integrity: sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==}

-  '@iconify-json/heroicons-solid@1.1.11':
-    resolution: {integrity: sha512-Nzhjs8voo4d+gcrfhlY/F0bRonEmLHT1+DeD2nYubvAF151pxXPqTS9bRB49Hqpdxl1l9LS2VTPtQPRypj/csQ==}
+  '@iconify/collections@1.0.445':
+    resolution: {integrity: sha512-xvIojlhJ5Xk5+Cj4M5JYvRXjkG5Ur++2ia7/ErUsTKh2eXene2d3JulzG98UvlSl9/WhfUKfE0N56GKttsjExw==}

  '@iconify/types@2.0.0':
    resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
@@ -972,6 +972,11 @@ packages:
  '@iconify/utils@2.1.29':
    resolution: {integrity: sha512-wCcTsmlJvTi1VWBgcJ7HeuWlh7gLGWY7L9HmbgMfjOfsoo7DADemB2Nqnrw1KvCdEAxLL5wTMBAOP5BesFrtng==}

+  '@iconify/vue@4.1.3-beta.1':
+    resolution: {integrity: sha512-N7iEOnWfhjbMqiyGMhotJKip23nrK5l3+T1hQwpEjKeMD2o4zOjm8zmeEfOOH81EXllhhOm7upR8jcH499YRWA==}
+    peerDependencies:
+      vue: '>=3'
+
  '@ioredis/commands@1.2.0':
    resolution: {integrity: sha512-Sx1pU8EM64o2BrqNpEO1CNLtKQwyhuXuqyfH7oGKCk+1a33d2r5saW8zNwm3j6BTExtjrv2BxTgzzkMwts6vGg==}

@@ -1099,6 +1104,9 @@ packages:
      vite-plugin-eslint2:
        optional: true

+  '@nuxt/icon@1.4.5':
+    resolution: {integrity: sha512-h0Fe1VhpVB5bcQutsH37G46DyE2u+j5j7+0sFbxT2ovRm+uILqo5ONXWe4WuJ20AtngvdpqvnqT25ZQtzx4K9A==}
+
  '@nuxt/kit@3.12.1':
    resolution: {integrity: sha512-PHONuNCMqi3FYp0abgkhF3iH1j6CznJLMLpa8qxDGH532ALDcR1ThxbxytTA3fPiYulG2KenK8jloDfNdXOfCA==}
    engines: {node: ^14.18.0 || >=16.10.0}
@@ -5292,8 +5300,8 @@ snapshots:
      eslint-plugin-regexp: 2.6.0(eslint@8.57.0)
      eslint-plugin-toml: 0.11.1(eslint@8.57.0)
      eslint-plugin-unicorn: 55.0.0(eslint@8.57.0)
-      eslint-plugin-unused-imports: 4.0.1(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)
-      eslint-plugin-vitest: 0.5.4(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4)
+      eslint-plugin-unused-imports: 4.0.1(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@8.0.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)
+      eslint-plugin-vitest: 0.5.4(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@8.0.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4)
      eslint-plugin-vue: 9.27.0(eslint@8.57.0)
      eslint-plugin-yml: 1.14.0(eslint@8.57.0)
      eslint-processor-vue-blocks: 0.1.2(@vue/compiler-sfc@3.4.35)(eslint@8.57.0)
@@ -6184,7 +6192,7 @@ snapshots:

  '@humanwhocodes/object-schema@2.0.3': {}

-  '@iconify-json/heroicons-solid@1.1.11':
+  '@iconify/collections@1.0.445':
    dependencies:
      '@iconify/types': 2.0.0

@@ -6202,6 +6210,11 @@ snapshots:
    transitivePeerDependencies:
      - supports-color

+  '@iconify/vue@4.1.3-beta.1(vue@3.4.35(typescript@5.5.4))':
+    dependencies:
+      '@iconify/types': 2.0.0
+      vue: 3.4.35(typescript@5.5.4)
+
  '@ioredis/commands@1.2.0': {}

  '@isaacs/cliui@8.0.2':
@@ -6449,6 +6462,26 @@ snapshots:
      - utf-8-validate
      - vite

+  '@nuxt/icon@1.4.5(magicast@0.3.4)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))(vue@3.4.35(typescript@5.5.4))':
+    dependencies:
+      '@iconify/collections': 1.0.445
+      '@iconify/types': 2.0.0
+      '@iconify/utils': 2.1.29
+      '@iconify/vue': 4.1.3-beta.1(vue@3.4.35(typescript@5.5.4))
+      '@nuxt/devtools-kit': 1.3.9(magicast@0.3.4)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))
+      '@nuxt/kit': 3.12.4(magicast@0.3.4)(rollup@4.18.0)
+      consola: 3.2.3
+      fast-glob: 3.3.2
+      local-pkg: 0.5.0
+      mlly: 1.7.1
+      pathe: 1.1.2
+    transitivePeerDependencies:
+      - magicast
+      - rollup
+      - supports-color
+      - vite
+      - vue
+
  '@nuxt/kit@3.12.1(rollup@4.18.0)':
    dependencies:
      '@nuxt/schema': 3.12.1(rollup@4.18.0)
@@ -7146,7 +7179,7 @@ snapshots:

  '@types/eslint-scope@3.7.7':
    dependencies:
-      '@types/eslint': 8.56.10
+      '@types/eslint': 9.6.0
      '@types/estree': 1.0.5

  '@types/eslint@8.56.10':
@@ -7476,7 +7509,7 @@ snapshots:
      gzip-size: 6.0.0
      sirv: 2.0.4

-  '@unocss/nuxt@0.61.9(magicast@0.3.4)(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))(webpack@5.91.0(esbuild@0.21.5))':
+  '@unocss/nuxt@0.61.9(magicast@0.3.4)(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))(webpack@5.91.0(esbuild@0.23.0))':
    dependencies:
      '@nuxt/kit': 3.12.4(magicast@0.3.4)(rollup@4.18.0)
      '@unocss/config': 0.61.9
@@ -7490,8 +7523,8 @@ snapshots:
      '@unocss/preset-wind': 0.61.9
      '@unocss/reset': 0.61.9
      '@unocss/vite': 0.61.9(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))
-      '@unocss/webpack': 0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.21.5))
-      unocss: 0.61.9(@unocss/webpack@0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.21.5)))(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))
+      '@unocss/webpack': 0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.23.0))
+      unocss: 0.61.9(@unocss/webpack@0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.23.0)))(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))
    transitivePeerDependencies:
      - magicast
      - postcss
@@ -7610,7 +7643,7 @@ snapshots:
      - rollup
      - supports-color

-  '@unocss/webpack@0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.21.5))':
+  '@unocss/webpack@0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.23.0))':
    dependencies:
      '@ampproject/remapping': 2.3.0
      '@rollup/pluginutils': 5.1.0(rollup@4.18.0)
@@ -7620,7 +7653,7 @@ snapshots:
      fast-glob: 3.3.2
      magic-string: 0.30.11
      unplugin: 1.12.0
-      webpack: 5.91.0(esbuild@0.21.5)
+      webpack: 5.91.0(esbuild@0.23.0)
      webpack-sources: 3.2.3
    transitivePeerDependencies:
      - rollup
@@ -7938,9 +7971,9 @@ snapshots:
    dependencies:
      event-target-shim: 5.0.1

-  acorn-import-assertions@1.9.0(acorn@8.12.0):
+  acorn-import-assertions@1.9.0(acorn@8.12.1):
    dependencies:
-      acorn: 8.12.0
+      acorn: 8.12.1

  acorn-import-attributes@1.9.5(acorn@8.12.1):
    dependencies:
@@ -8821,14 +8854,14 @@ snapshots:
      semver: 7.6.2
      strip-indent: 3.0.0

-  eslint-plugin-unused-imports@4.0.1(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0):
+  eslint-plugin-unused-imports@4.0.1(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@8.0.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0):
    dependencies:
      eslint: 8.57.0
      eslint-rule-composer: 0.3.0
    optionalDependencies:
      '@typescript-eslint/eslint-plugin': 8.0.0(@typescript-eslint/parser@8.0.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4)

-  eslint-plugin-vitest@0.5.4(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4):
+  eslint-plugin-vitest@0.5.4(@typescript-eslint/eslint-plugin@8.0.0(@typescript-eslint/parser@8.0.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4):
    dependencies:
      '@typescript-eslint/utils': 7.15.0(eslint@8.57.0)(typescript@5.5.4)
      eslint: 8.57.0
@@ -10825,7 +10858,7 @@ snapshots:
  synckit@0.8.8:
    dependencies:
      '@pkgr/core': 0.1.1
-      tslib: 2.6.2
+      tslib: 2.6.3
    optional: true

  synckit@0.9.1:
@@ -10852,16 +10885,16 @@ snapshots:
      mkdirp: 1.0.4
      yallist: 4.0.0

-  terser-webpack-plugin@5.3.10(esbuild@0.21.5)(webpack@5.91.0(esbuild@0.21.5)):
+  terser-webpack-plugin@5.3.10(esbuild@0.23.0)(webpack@5.91.0(esbuild@0.23.0)):
    dependencies:
      '@jridgewell/trace-mapping': 0.3.25
      jest-worker: 27.5.1
      schema-utils: 3.3.0
      serialize-javascript: 6.0.2
      terser: 5.30.3
-      webpack: 5.91.0(esbuild@0.21.5)
+      webpack: 5.91.0(esbuild@0.23.0)
    optionalDependencies:
-      esbuild: 0.21.5
+      esbuild: 0.23.0

  terser@5.30.3:
    dependencies:
@@ -11013,7 +11046,7 @@ snapshots:

  universalify@2.0.1: {}

-  unocss@0.61.9(@unocss/webpack@0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.21.5)))(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3)):
+  unocss@0.61.9(@unocss/webpack@0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.23.0)))(postcss@8.4.39)(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3)):
    dependencies:
      '@unocss/astro': 0.61.9(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))
      '@unocss/cli': 0.61.9(rollup@4.18.0)
@@ -11036,7 +11069,7 @@ snapshots:
      '@unocss/transformer-variant-group': 0.61.9
      '@unocss/vite': 0.61.9(rollup@4.18.0)(vite@5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3))
    optionalDependencies:
-      '@unocss/webpack': 0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.21.5))
+      '@unocss/webpack': 0.61.9(rollup@4.18.0)(webpack@5.91.0(esbuild@0.23.0))
      vite: 5.3.5(@types/node@20.12.7)(sass@1.77.8)(terser@5.30.3)
    transitivePeerDependencies:
      - postcss
@@ -11317,15 +11350,15 @@ snapshots:

  webpack-virtual-modules@0.6.2: {}

-  webpack@5.91.0(esbuild@0.21.5):
+  webpack@5.91.0(esbuild@0.23.0):
    dependencies:
      '@types/eslint-scope': 3.7.7
      '@types/estree': 1.0.5
      '@webassemblyjs/ast': 1.12.1
      '@webassemblyjs/wasm-edit': 1.12.1
      '@webassemblyjs/wasm-parser': 1.12.1
-      acorn: 8.12.0
-      acorn-import-assertions: 1.9.0(acorn@8.12.0)
+      acorn: 8.12.1
+      acorn-import-assertions: 1.9.0(acorn@8.12.1)
      browserslist: 4.23.1
      chrome-trace-event: 1.0.3
      enhanced-resolve: 5.17.0
@@ -11340,7 +11373,7 @@ snapshots:
      neo-async: 2.6.2
      schema-utils: 3.3.0
      tapable: 2.2.1
-      terser-webpack-plugin: 5.3.10(esbuild@0.21.5)(webpack@5.91.0(esbuild@0.21.5))
+      terser-webpack-plugin: 5.3.10(esbuild@0.23.0)(webpack@5.91.0(esbuild@0.23.0))
      watchpack: 2.4.1
      webpack-sources: 3.2.3
    transitivePeerDependencies:
--- a/src/components/Site/Navbar.vue
+++ b/src/components/Site/Navbar.vue
@@ -8,7 +8,7 @@
 			</div>
 			<div flex lg="hidden">
 				<button type="button" @click="showSidebar = true" inline-flex items-center justify-center rounded-md p-2.5 text-neutral-300 m="-2.5">
-					<i-heroicons-solid-bars-3 size-6 />
+					<Icon name="heroicons-solid:bars-3" size-6 />
 				</button>
 			</div>
 			<div hidden lg="flex gap-x-12">
--- a/src/components/Site/Sidebar.vue
+++ b/src/components/Site/Sidebar.vue
@@ -11,7 +11,7 @@
 							<SvgoLogo :filled="true" :font-controlled="false" size-8 />
 						</NuxtLink>
 						<button type="button" rounded-md p-2.5 text-neutral-300 m="2.5" @click="showSidebar = false">
-							<i-heroicons-solid-x-mark size-6 />
+							<Icon name="heroicons-solid:x-mark" size-6 />
 						</button>
 					</div>
 					<div mt-6 flow-root>
--- a/src/pages/file.vue
+++ b/src/pages/file.vue
@@ -24,11 +24,11 @@
 					<div flex justify-end gap-3>
 						<div v-if="done" h-full flex-center text-emerald-400 space-x-1>
 							<p>Done</p>
-							<i-heroicons-solid-check size-4 />
+							<Icon name="heroicons-solid:check" size-4 />
 						</div>
 						<div v-if="error" h-full flex-center text-red-400 space-x-1>
 							<p>Error</p>
-							<i-heroicons-solid-exclamation-triangle size-4 />
+							<Icon name="heroicons-solid:exclamation-triangle" size-4 />
 						</div>
 						<Btn type="submit" :disabled="fileName === ''">
 							Create file
--- a/uno.config.ts
+++ b/uno.config.ts
@@ -1,7 +1,6 @@
 import {
 	defineConfig,
 	presetAttributify,
-	presetIcons,
 	presetTagify,
 	presetTypography,
 	presetUno,
@@ -21,12 +20,6 @@ export default defineConfig({
 		presetUno(),
 		presetTagify(),
 		presetAttributify(),
-		presetIcons({
-			extraProperties: {
-				display: "inline-block",
-				"vertical-align": "middle"
-			}
-		}),
 		presetTypography(),
 		presetWebFonts({
 			fonts: {