diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index 3877ce649..bbeb60d40 100644 --- a/docs/.vitepress/config.ts +++ b/docs/.vitepress/config.ts @@ -1,5 +1,6 @@ import type { DefaultTheme } from 'vitepress' import { defineConfig } from 'vitepress' +import { groupIconMdPlugin } from 'vitepress-plugin-group-icons' import vite from './vite.config' const GETTING_STARTED: DefaultTheme.NavItemWithLink[] = [ @@ -39,6 +40,9 @@ export default defineConfig({ light: 'vitesse-light', dark: 'vitesse-dark', }, + config(md) { + md.use(groupIconMdPlugin) + }, }, cleanUrls: true, diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts index ca9964f18..df5f8bf37 100644 --- a/docs/.vitepress/theme/index.ts +++ b/docs/.vitepress/theme/index.ts @@ -3,6 +3,7 @@ import Theme from 'vitepress/theme' import { h } from 'vue' import 'uno.css' import './style.css' +import 'virtual:group-icons.css' export default { extends: Theme, diff --git a/docs/.vitepress/vite.config.ts b/docs/.vitepress/vite.config.ts index 6f6714582..4103d5249 100644 --- a/docs/.vitepress/vite.config.ts +++ b/docs/.vitepress/vite.config.ts @@ -2,6 +2,7 @@ import { fileURLToPath } from 'node:url' import UnoCSS from 'unocss/vite' import Components from 'unplugin-vue-components/vite' import { defineConfig } from 'vite' +import { groupIconVitePlugin } from 'vitepress-plugin-group-icons' export default defineConfig({ plugins: [ @@ -13,6 +14,7 @@ export default defineConfig({ include: [/\.vue$/, /\.vue\?vue/, /\.md$/], extensions: ['vue', 'md'], }), + groupIconVitePlugin(), UnoCSS( fileURLToPath(new URL('./uno.config.ts', import.meta.url)), ), diff --git a/docs/getting-started/open-in-editor.md b/docs/getting-started/open-in-editor.md index c2f161e36..b5ed35185 100644 --- a/docs/getting-started/open-in-editor.md +++ b/docs/getting-started/open-in-editor.md @@ -12,7 +12,7 @@ Starting from **v7.2.0**, you can specify the editor by `launchEditor` option: This is a list of [supported editors](https://github.com/yyx990803/launch-editor?tab=readme-ov-file#supported-editors), please ensure that the editor's environment variables are correctly configured beforehand. -```ts +```ts [vite.config.ts] import VueDevTools from 'vite-plugin-vue-devtools' export default defineConfig({ diff --git a/docs/guide/vite-plugin.md b/docs/guide/vite-plugin.md index ef4a0ff63..6626b4730 100644 --- a/docs/guide/vite-plugin.md +++ b/docs/guide/vite-plugin.md @@ -30,9 +30,7 @@ $ bun add -D vite-plugin-vue-devtools ## Usage -```ts -// Configuration Vite - +```ts [vite.config.ts] import { defineConfig } from 'vite' import vueDevTools from 'vite-plugin-vue-devtools' diff --git a/docs/help/faq.md b/docs/help/faq.md index c71544855..bf63ee40d 100644 --- a/docs/help/faq.md +++ b/docs/help/faq.md @@ -10,7 +10,7 @@ Starting from **v7.2.0**, you can specify the editor by `launchEditor` option: This is a list of [supported editors](https://github.com/yyx990803/launch-editor?tab=readme-ov-file#supported-editors), please ensure that the editor's environment variables are correctly configured beforehand. -```ts +```ts [vite.config.ts] import VueDevTools from 'vite-plugin-vue-devtools' export default defineConfig({ @@ -25,7 +25,7 @@ export default defineConfig({ ## How to work with Laravel Vite Plugin? -```ts +```ts [vite.config.ts] import laravel from 'laravel-vite-plugin' import { defineConfig } from 'vite' import VueDevTools from 'vite-plugin-vue-devtools' @@ -48,9 +48,7 @@ export default defineConfig({ We still recommend using [Nuxt DevTools](https://github.com/nuxt/devtools) for a better development experience. ::: -```ts -// nuxt.config.ts - +```ts [nuxt.config.ts] export default defineNuxtConfig({ vite: { plugins: [ @@ -64,7 +62,7 @@ export default defineNuxtConfig({ ## How to work with [Vite Ruby](https://vite-ruby.netlify.app/)? -```ts +```ts [vite.config.ts] import vue from '@vitejs/plugin-vue' import { defineConfig } from 'vite' import RubyPlugin from 'vite-plugin-ruby' @@ -83,8 +81,7 @@ export default defineConfig({ ## How to work with [WXT](https://wxt.dev/)? -```ts -// wxt.config.ts +```ts [wxt.config.ts] import devtools from 'vite-plugin-vue-devtools' import { defineConfig } from 'wxt' diff --git a/docs/help/troubleshooting.md b/docs/help/troubleshooting.md index 204b24ce5..a616fb4c9 100644 --- a/docs/help/troubleshooting.md +++ b/docs/help/troubleshooting.md @@ -8,8 +8,7 @@ If you see devtools render as follows: And you are using `vite-plugin-html`, please make sure register `vite-plugin-vue-devtools` before `vite-plugin-html`. -```ts -// vite.config.ts +```ts [vite.config.ts] import { defineConfig } from 'vite' import { createHtmlPlugin } from 'vite-plugin-html' import vueDevTools from 'vite-plugin-vue-devtools' diff --git a/docs/package.json b/docs/package.json index c12aba84a..66927d501 100644 --- a/docs/package.json +++ b/docs/package.json @@ -12,6 +12,7 @@ "@vueuse/core": "catalog:", "unplugin-vue-components": "^29.1.0", "vitepress": "1.6.4", + "vitepress-plugin-group-icons": "^1.7.1", "vue": "catalog:" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 31e23ae4d..a66de43fd 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -6,9 +6,81 @@ settings: catalogs: default: + '@iconify/json': + specifier: ^2.2.395 + version: 2.2.395 + '@types/node': + specifier: ^24.7.2 + version: 24.7.2 + '@unocss/reset': + specifier: ^66.5.4 + version: 66.5.4 + '@vitejs/plugin-vue': + specifier: ^6.0.1 + version: 6.0.1 + '@vueuse/core': + specifier: ^13.9.0 + version: 13.9.0 + '@vueuse/integrations': + specifier: ^13.9.0 + version: 13.9.0 + colord: + specifier: ^2.9.3 + version: 2.9.3 + floating-vue: + specifier: 5.2.2 + version: 5.2.2 + pathe: + specifier: ^2.0.3 + version: 2.0.3 + perfect-debounce: + specifier: ^2.0.0 + version: 2.0.0 + pinia: + specifier: ^3.0.3 + version: 3.0.3 + sass-embedded: + specifier: ^1.93.2 + version: 1.93.2 + serve: + specifier: ^14.2.5 + version: 14.2.5 + shiki: + specifier: ^3.13.0 + version: 3.13.0 + splitpanes: + specifier: ^4.0.4 + version: 4.0.4 + typescript: + specifier: ^5.9.3 + version: 5.9.3 + unocss: + specifier: ^66.5.4 + version: 66.5.4 + unplugin-auto-import: + specifier: ^20.2.0 + version: 20.2.0 + vite: + specifier: ^7.1.10 + version: 7.1.10 + vite-hot-client: + specifier: ^2.1.0 + version: 2.1.0 + vite-plugin-dts: + specifier: ^4.5.4 + version: 4.5.4 + vite-plugin-inspect: + specifier: ^11.3.3 + version: 11.3.3 vue: specifier: ^3.5.22 version: 3.5.22 + vue-router: + specifier: ^4.6.0 + version: 4.6.0 + vue-virtual-scroller: + specifier: 2.0.0-beta.8 + version: 2.0.0-beta.8 importers: @@ -164,6 +236,9 @@ importers: vitepress: specifier: 1.6.4 version: 1.6.4(@algolia/client-search@5.37.0)(@types/node@24.7.2)(async-validator@4.2.5)(change-case@5.4.4)(fuse.js@7.1.0)(postcss@8.5.6)(sass-embedded@1.93.2)(sass@1.93.2)(search-insights@2.17.3)(terser@5.44.0)(typescript@5.9.3) + vitepress-plugin-group-icons: + specifier: ^1.7.1 + version: 1.7.1(vite@5.4.20(@types/node@24.7.2)(sass-embedded@1.93.2)(sass@1.93.2)(terser@5.44.0)) vue: specifier: 'catalog:' version: 3.5.22(typescript@5.9.3) @@ -2214,9 +2289,15 @@ packages: '@iconify-json/ic@1.2.4': resolution: {integrity: sha512-pzPMmrZrBQuwT7nmtrYdkttun8KalRGgZPIL1Ny9KpF2zjRGIUPN+npTfuD3lrgO/OnSwAoJWuekQwBpt/Cqrw==} + '@iconify-json/logos@1.2.10': + resolution: {integrity: sha512-qxaXKJ6fu8jzTMPQdHtNxlfx6tBQ0jXRbHZIYy5Ilh8Lx9US9FsAdzZWUR8MXV8PnWTKGDFO4ZZee9VwerCyMA==} + '@iconify-json/simple-icons@1.2.51': resolution: {integrity: sha512-vFH0QEHFG3rt9hZOR3oE/ZfAKFA7cS11UXttD/IphClEbiSTsPbpeeJ4kRYGDBUDmAKhBzk6jxHNG8VipwA69Q==} + '@iconify-json/vscode-icons@1.2.45': + resolution: {integrity: sha512-ow+ueibMIq79ueM1kv6cOWgHx8jfh1XJQi2RrqMHb4HLbvIBlxpy5PCMvOJXlA68R6fBAHpWQeh6uWx7VKEVsA==} + '@iconify/json@2.2.395': resolution: {integrity: sha512-XSYOnlGqiZhJkFFBUiVK4C5VIiv4rxyKtCmkQ9nS4zfMpS4xT0BF9+qWUKOHYgeCzCLghyWfrm6Eti3Sv5kfqQ==} @@ -2226,6 +2307,9 @@ packages: '@iconify/utils@3.0.2': resolution: {integrity: sha512-EfJS0rLfVuRuJRn4psJHtK2A9TqVnkxPpHY6lYHiB9+8eSuudsxbwMiavocG45ujOo6FJ+CIRlRnlOGinzkaGQ==} + '@iconify/utils@3.1.0': + resolution: {integrity: sha512-Zlzem1ZXhI1iHeeERabLNzBHdOa4VhQbqAcOQaMKuTuyZCpwKbC2R4Dd0Zo3g9EAc+Y4fiarO8HIHRAth7+skw==} + '@isaacs/balanced-match@4.0.1': resolution: {integrity: sha512-yzMTt9lEb8Gv7zRioUilSglI0c0smZ9k5D65677DLWLtWJaXIS3CqcGyUFByYKlnUj6TkjLVs54fBl6+TiGQDQ==} engines: {node: 20 || >=22} @@ -9037,6 +9121,14 @@ packages: yaml: optional: true + vitepress-plugin-group-icons@1.7.1: + resolution: {integrity: sha512-3ZPcIqwHNBg1btrOOSecOqv8yJxHdu3W2ugxE5LusclDF005LAm60URMEmBQrkgl4JvM32AqJirqghK6lGIk8g==} + peerDependencies: + vite: '>=3' + peerDependenciesMeta: + vite: + optional: true + vitepress@1.6.4: resolution: {integrity: sha512-+2ym1/+0VVrbhNyRoFFesVvBvHAVMZMK0rw60E3X/5349M1GuVdKeazuksqopEdvkKwKGs21Q729jX81/bkBJg==} hasBin: true @@ -10964,10 +11056,18 @@ snapshots: dependencies: '@iconify/types': 2.0.0 + '@iconify-json/logos@1.2.10': + dependencies: + '@iconify/types': 2.0.0 + '@iconify-json/simple-icons@1.2.51': dependencies: '@iconify/types': 2.0.0 + '@iconify-json/vscode-icons@1.2.45': + dependencies: + '@iconify/types': 2.0.0 + '@iconify/json@2.2.395': dependencies: '@iconify/types': 2.0.0 @@ -10988,6 +11088,12 @@ snapshots: transitivePeerDependencies: - supports-color + '@iconify/utils@3.1.0': + dependencies: + '@antfu/install-pkg': 1.1.0 + '@iconify/types': 2.0.0 + mlly: 1.8.0 + '@isaacs/balanced-match@4.0.1': {} '@isaacs/brace-expansion@5.0.0': @@ -18668,6 +18774,14 @@ snapshots: tsx: 4.20.6 yaml: 2.8.1 + vitepress-plugin-group-icons@1.7.1(vite@5.4.20(@types/node@24.7.2)(sass-embedded@1.93.2)(sass@1.93.2)(terser@5.44.0)): + dependencies: + '@iconify-json/logos': 1.2.10 + '@iconify-json/vscode-icons': 1.2.45 + '@iconify/utils': 3.1.0 + optionalDependencies: + vite: 5.4.20(@types/node@24.7.2)(sass-embedded@1.93.2)(sass@1.93.2)(terser@5.44.0) + vitepress@1.6.4(@algolia/client-search@5.37.0)(@types/node@24.7.2)(async-validator@4.2.5)(change-case@5.4.4)(fuse.js@7.1.0)(postcss@8.5.6)(sass-embedded@1.93.2)(sass@1.93.2)(search-insights@2.17.3)(terser@5.44.0)(typescript@5.9.3): dependencies: '@docsearch/css': 3.8.2