From 02dfed5fcdc20cac7acdeca8bc5f7fb5c814a79b Mon Sep 17 00:00:00 2001
From: zernonia <zernonia@gmail.com>
Date: Fri, 1 Dec 2023 10:50:55 +0800
Subject: [PATCH] docs: update nuxt installation with new module

---
 .../www/src/content/docs/installation/nuxt.md | 39 +++++++++----------
 1 file changed, 18 insertions(+), 21 deletions(-)

diff --git a/apps/www/src/content/docs/installation/nuxt.md b/apps/www/src/content/docs/installation/nuxt.md
index acf5dab9..bae0e51e 100644
--- a/apps/www/src/content/docs/installation/nuxt.md
+++ b/apps/www/src/content/docs/installation/nuxt.md
@@ -26,31 +26,28 @@ npm install -D typescript
 npm install -D @nuxtjs/tailwindcss
 ```
 
+### Install `shadcn-nuxt` module (New ✨)
+
+```bash
+npm install -D shadcn-nuxt
+```
+
+
 ### Configure `nuxt.config.ts`
 
-<Callout class="mt-4">
-
-**Tip:** It's better to use Nuxt `components:dirs` hook to extend auto-import components directories. 
-
-If you use `components` key in `nuxt.config.ts` default config will disposed
-
-</Callout>
-
 ```ts
 export default defineNuxtConfig({
-  modules: ['@nuxtjs/tailwindcss'],
-  hooks: {
-    'components:dirs': (dirs) => {
-      dirs.unshift({
-        path: '~/components/ui',
-        // this is required else Nuxt will autoImport `.ts` file
-        extensions: ['.vue'],
-        // prefix for your components, eg: UiButton
-        prefix: 'Ui',
-        // prevent adding another prefix component by it's path.
-        pathPrefix: false
-      })
-    }
+  modules: ['@nuxtjs/tailwindcss', 'shadcn-nuxt'],
+  shadcn: {
+    /**
+     * Prefix for all the imported component
+     */
+    prefix: '',
+    /**
+     * Directory that the component lives in.
+     * @default "./components/ui"
+     */
+    componentDir: './components/ui'
   }
 })
 ```