From 0b097352b429e3e11422ee3340a4c5d29786a4b8 Mon Sep 17 00:00:00 2001 From: Benjamin Canac Date: Fri, 19 May 2023 11:28:52 +0200 Subject: [PATCH] docs: theming icons with `all` param --- docs/content/1.getting-started/3.theming.md | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/docs/content/1.getting-started/3.theming.md b/docs/content/1.getting-started/3.theming.md index a72049e6..b412144b 100644 --- a/docs/content/1.getting-started/3.theming.md +++ b/docs/content/1.getting-started/3.theming.md @@ -115,7 +115,7 @@ Search the icon you want to use on https://icones.js.org built by [@antfu](https Unlike the official [nuxt-icon](https://github.com/nuxt-modules/icon/) module, this module will not fetch any icon from the web and will only bundle the icons you use in your app thanks to [egoist/tailwindcss-icons](https://github.com/egoist/tailwindcss-icons). -However, you will need to install the icon packages you want to use. +However, you will need to install either `@iconify/json` (full icon collections, 50MB) or the individual icon packages you want to use in your app. ::code-group @@ -133,6 +133,16 @@ pnpm i -D @iconify-json/{collection_name} :: +When using `@iconify/json`, you can specifiy `icons: 'all'` in your `nuxt.config.ts` to use any icon in your app. + +```ts [nuxt.config.ts] +export default defineNuxtConfig({ + ui: { + icons: 'all' + } +}) +``` + You can easily replace all the default icons of the components in your `app.config.ts`. ```ts [app.config.ts]