diff --git a/apps/showcase/doc/cdn/ExampleDoc.vue b/apps/showcase/doc/cdn/ExampleDoc.vue
index 39879b7ce..ff6fc7cc9 100644
--- a/apps/showcase/doc/cdn/ExampleDoc.vue
+++ b/apps/showcase/doc/cdn/ExampleDoc.vue
@@ -20,8 +20,8 @@ export default {
   </head>
   <body>
     <script src="https://unpkg.com/vue@3/dist/vue.global.js"><\/script>
-    <script src="https://unpkg.com/primevue@4.0.0-rc.2/umd/primevue.min.js"><\/script>
-    <script src="https://unpkg.com/@primevue/themes@4.0.0-rc.2/umd/aura.min.js"><\/script>
+    <script src="https://unpkg.com/primevue/umd/primevue.min.js"><\/script>
+    <script src="https://unpkg.com/@primevue/themes/umd/aura.min.js"><\/script>
 
     <div id="app">
       <p-datepicker v-model="date"></p-datepicker>
diff --git a/apps/showcase/doc/cdn/ScriptDoc.vue b/apps/showcase/doc/cdn/ScriptDoc.vue
index df7bff365..b0f26759a 100644
--- a/apps/showcase/doc/cdn/ScriptDoc.vue
+++ b/apps/showcase/doc/cdn/ScriptDoc.vue
@@ -16,8 +16,8 @@ export default {
             code: {
                 basic: `
 https://unpkg.com/vue@3/dist/vue.global.js
-https://unpkg.com/primevue@4.0.0-rc.2/umd/primevue.min.js
-https://unpkg.com/@primevue/themes@4.0.0-rc.2/umd/aura.min.js  // see theming for alternatives
+https://unpkg.com/primevue/umd/primevue.min.js
+https://unpkg.com/@primevue/themes/umd/aura.min.js  // see theming for alternatives
 `
             }
         };
diff --git a/apps/showcase/doc/cdn/ThemingDoc.vue b/apps/showcase/doc/cdn/ThemingDoc.vue
index 63b49282a..9c9d0c78d 100644
--- a/apps/showcase/doc/cdn/ThemingDoc.vue
+++ b/apps/showcase/doc/cdn/ThemingDoc.vue
@@ -11,11 +11,11 @@ export default {
         return {
             code: {
                 basic: `
-<!-- <script src="https://unpkg.com/@primevue/themes@4.0.0-rc.2/umd/{preset}.min.js"><\/script> -->
+<!-- <script src="https://unpkg.com/@primevue/themes/umd/{preset}.min.js"><\/script> -->
 
-<script src="https://unpkg.com/@primevue/themes@4.0.0-rc.2/umd/aura.min.js"><\/script>
-<script src="https://unpkg.com/@primevue/themes@4.0.0-rc.2/umd/lara.min.js"><\/script>
-<script src="https://unpkg.com/@primevue/themes@4.0.0-rc.2/umd/nora.min.js"><\/script>
+<script src="https://unpkg.com/@primevue/themes/umd/aura.min.js"><\/script>
+<script src="https://unpkg.com/@primevue/themes/umd/lara.min.js"><\/script>
+<script src="https://unpkg.com/@primevue/themes/umd/nora.min.js"><\/script>
 `
             }
         };
diff --git a/apps/showcase/doc/nuxt/AutoImportDoc.vue b/apps/showcase/doc/nuxt/AutoImportDoc.vue
new file mode 100644
index 000000000..3ccea421b
--- /dev/null
+++ b/apps/showcase/doc/nuxt/AutoImportDoc.vue
@@ -0,0 +1,40 @@
+<template>
+    <DocSectionText v-bind="$attrs">
+        <p>
+            The <NuxtLink to="/autoimport">auto import</NuxtLink> feature registers components automatically with tree shaking support. Defaults to <i>true</i>, when disabled use include/exclude options of <i>components</i> and <i>directives</i> for
+            manual registration.
+        </p>
+        <DocSectionCode :code="code1" hideToggleCode importCode hideStackBlitz />
+        <p>Use the <i>prefix</i> in <i>components</i> and <i>directives</i> to add a prefix for registration.</p>
+        <DocSectionCode :code="code2" hideToggleCode importCode hideStackBlitz />
+    </DocSectionText>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            code1: {
+                basic: `
+primevue: {
+    autoImport: true|false
+}
+`
+            },
+            code2: {
+                basic: `
+primevue: {
+    autoImport: true|false,
+    components: {
+        prefix: 'org'
+    },
+    directives: {
+        prefix: 'org'
+    }
+}
+`
+            }
+        };
+    }
+};
+</script>
diff --git a/apps/showcase/doc/nuxt/DownloadDoc.vue b/apps/showcase/doc/nuxt/DownloadDoc.vue
index c13ef301a..fd32f96d6 100644
--- a/apps/showcase/doc/nuxt/DownloadDoc.vue
+++ b/apps/showcase/doc/nuxt/DownloadDoc.vue
@@ -15,16 +15,16 @@ export default {
             code: {
                 basic: `
 # Using npm
-npm install primevue@4.0.0-rc.2
-npm install --save-dev @primevue/nuxt-module@4.0.0-rc.2
+npm install primevue
+npm install --save-dev @primevue/nuxt-module
 
 # Using yarn
-yarn add primevue@4.0.0-rc.2
-yarn add --dev @primevue/nuxt-module@4.0.0-rc.2
+yarn add primevue
+yarn add --dev @primevue/nuxt-module
 
 # Using pnpm
-pnpm add primevue@4.0.0-rc.2
-pnpm add -D @primevue/nuxt-module@4.0.0-rc.2
+pnpm add primevue
+pnpm add -D @primevue/nuxt-module
 `
             }
         };
diff --git a/apps/showcase/doc/nuxt/SetupDoc.vue b/apps/showcase/doc/nuxt/SetupDoc.vue
index f231af691..17ab095b2 100644
--- a/apps/showcase/doc/nuxt/SetupDoc.vue
+++ b/apps/showcase/doc/nuxt/SetupDoc.vue
@@ -1,9 +1,6 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>
-            In <i>nuxt.config</i> file, add the <i>@primevue/nuxt-module</i> to the modules section and define <i>primevue</i> object for the configuration of the module. View the
-            <NuxtLink to="/nuxt/#configuration">module configuration</NuxtLink> section for the available list of options.
-        </p>
+        <p>In <i>nuxt.config</i> file, add the <i>@primevue/nuxt-module</i> to the modules section and define <i>primevue</i> object for the configuration of the module.</p>
         <DocSectionCode :code="code1" importCode hideToggleCode hideStackBlitz />
     </DocSectionText>
 </template>
@@ -19,7 +16,7 @@ export default defineNuxtConfig({
         '@primevue/nuxt-module'
     ],
     primevue: {
-        /* Options */
+        /* Configuration */
     }
 })
 `
diff --git a/apps/showcase/doc/nuxt/StyledModeDoc.vue b/apps/showcase/doc/nuxt/StyledModeDoc.vue
new file mode 100644
index 000000000..e3e033f08
--- /dev/null
+++ b/apps/showcase/doc/nuxt/StyledModeDoc.vue
@@ -0,0 +1,48 @@
+<template>
+    <DocSectionText v-bind="$attrs">
+        <p>Styled mode provides pre-skinned components, default theme is Aura with emerald as the primary color. See the <NuxtLink to="/theming/styled">styled mode</NuxtLink> documentation for details.</p>
+        <p>Install the <i>@primevue/themes</i> add-on package as the themes are not included in PrimeVue by default.</p>
+        <DocSectionCode :code="code1" hideToggleCode hideStackBlitz />
+        <p>Configure the module to use a theme like Aura.</p>
+        <DocSectionCode :code="code2" importCode hideToggleCode hideStackBlitz />
+    </DocSectionText>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            code1: {
+                basic: `
+# Using npm
+npm install @primevue/themes
+
+# Using yarn
+yarn add @primevue/themes
+
+# Using pnpm
+pnpm add @primevue/themes
+`
+            },
+            code2: {
+                basic: `
+import Aura from '@primevue/themes/aura';
+
+export default defineNuxtConfig({
+    modules: [
+        '@primevue/nuxt-module'
+    ],
+    primevue: {
+        options: {
+            theme: {
+                preset: Aura
+            }
+        }
+    }
+})
+`
+            }
+        };
+    }
+};
+</script>
diff --git a/apps/showcase/doc/nuxt/UnstyledModeDoc.vue b/apps/showcase/doc/nuxt/UnstyledModeDoc.vue
new file mode 100644
index 000000000..7c3660cd9
--- /dev/null
+++ b/apps/showcase/doc/nuxt/UnstyledModeDoc.vue
@@ -0,0 +1,32 @@
+<template>
+    <DocSectionText v-bind="$attrs">
+        <p>
+            In unstyled mode, the components do not include any CSS so you'd need to style the components on your end, this is especially useful when building your own UI library on top of PrimeVue. Visit the
+            <NuxtLink to="/theming/unstyled">Unstyled mode</NuxtLink> documentation for more information and examples.
+        </p>
+        <DocSectionCode :code="code1" hideToggleCode importCode hideStackBlitz />
+    </DocSectionText>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            code1: {
+                basic: `
+export default defineNuxtConfig({
+    modules: [
+        '@primevue/nuxt-module'
+    ],
+    primevue: {
+        options: {
+            unstyled: true
+        }
+    }
+})
+`
+            }
+        };
+    }
+};
+</script>
diff --git a/apps/showcase/doc/nuxt/UsageDoc.vue b/apps/showcase/doc/nuxt/UsageDoc.vue
index cc92ab8cd..ff8fc2f74 100644
--- a/apps/showcase/doc/nuxt/UsageDoc.vue
+++ b/apps/showcase/doc/nuxt/UsageDoc.vue
@@ -1,6 +1,6 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>The nuxt-primevue module registers the components automatically so you may start using them instantly. See the <NuxtLink to="/nuxt/#components">Components</NuxtLink> section to customize how the components are loaded and named.</p>
+        <p>The nuxt-primevue module registers the components automatically so you may start using them instantly.</p>
     </DocSectionText>
     <div class="card flex justify-center">
         <Button label="Check" icon="pi pi-check" />
diff --git a/apps/showcase/doc/nuxt/configuration/ComponentsDoc.vue b/apps/showcase/doc/nuxt/configuration/ComponentsDoc.vue
index d6001da4b..0cb9e49fa 100644
--- a/apps/showcase/doc/nuxt/configuration/ComponentsDoc.vue
+++ b/apps/showcase/doc/nuxt/configuration/ComponentsDoc.vue
@@ -1,5 +1,6 @@
 <template>
     <DocSectionText v-bind="$attrs">
+        <p>When <i>autoImport</i> is disabled, use the <i>include</i> and <i>exclude</i> for manual registration.</p>
         <p>The components to import and register are defined with the <i>include</i> option using a string array. When the value is ignored or set using the <i>*</i> alias, all of the components are registered.</p>
         <DocSectionCode :code="code1" importCode hideToggleCode hideStackBlitz />
         <p>In case all components are imported, particular components can still be excluded with the <i>exclude</i> option.</p>
diff --git a/apps/showcase/doc/nuxt/configuration/DirectivesDoc.vue b/apps/showcase/doc/nuxt/configuration/DirectivesDoc.vue
index d1b26b9f7..7dfe84ce2 100644
--- a/apps/showcase/doc/nuxt/configuration/DirectivesDoc.vue
+++ b/apps/showcase/doc/nuxt/configuration/DirectivesDoc.vue
@@ -1,5 +1,6 @@
 <template>
     <DocSectionText v-bind="$attrs">
+        <p>When <i>autoImport</i> is disabled, use the <i>include</i> and <i>exclude</i> for manual registration.</p>
         <p>The names of the directives to import and register are provided using the <i>include</i> property. When the value is ignored or set using the <i>*</i> alias, all of the directives are registered.</p>
         <DocSectionCode :code="code1" importCode hideToggleCode hideStackBlitz />
         <p>Similar to components, certain directives can be excluded and name registration can be customized.</p>
diff --git a/apps/showcase/doc/nuxt/configuration/OptionsDoc.vue b/apps/showcase/doc/nuxt/configuration/OptionsDoc.vue
index f6531d25f..11d593f6b 100644
--- a/apps/showcase/doc/nuxt/configuration/OptionsDoc.vue
+++ b/apps/showcase/doc/nuxt/configuration/OptionsDoc.vue
@@ -11,13 +11,27 @@ export default {
         return {
             code: {
                 basic: `
-primevue: {
-    options: {
-        unstyled: true,
-        ripple: true,
-        inputVariant: 'filled'
+import Aura from '@primevue/themes/aura';
+
+export default defineNuxtConfig({
+    modules: [
+        '@primevue/nuxt-module'
+    ],
+    primevue: {
+        options: {
+            ripple: true,
+            inputVariant: 'filled',
+            theme: {
+                preset: Aura,
+                options: {
+                    prefix: 'p',
+                    darkModeSelector: 'system',
+                    cssLayer: false
+                }
+            }
+        }
     }
-}
+})
 `
             }
         };
diff --git a/apps/showcase/doc/nuxt/configuration/UsePrimeVueDoc.vue b/apps/showcase/doc/nuxt/configuration/UsePrimeVueDoc.vue
index 25205cc10..d1d8ddc5b 100644
--- a/apps/showcase/doc/nuxt/configuration/UsePrimeVueDoc.vue
+++ b/apps/showcase/doc/nuxt/configuration/UsePrimeVueDoc.vue
@@ -1,6 +1,6 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>Whether to install the PrimeVue plugin, defaults to <i>true</i>. Disable this option if you prefer to configure PrimeVue manually e.g. with a Nuxt plugin.</p>
+        <p>The module installs the PrimeVue plugin by default. Disable this option if you prefer to configure PrimeVue manually e.g. with a Nuxt plugin.</p>
     </DocSectionText>
     <DocSectionCode :code="code" importCode hideToggleCode hideStackBlitz />
 </template>
diff --git a/apps/showcase/doc/vite/DownloadDoc.vue b/apps/showcase/doc/vite/DownloadDoc.vue
index 425b3c681..d9fb3b453 100644
--- a/apps/showcase/doc/vite/DownloadDoc.vue
+++ b/apps/showcase/doc/vite/DownloadDoc.vue
@@ -12,13 +12,13 @@ export default {
             code: {
                 basic: `
 # Using npm
-npm install primevue@4.0.0-rc.2
+npm install primevue
 
 # Using yarn
-yarn add primevue@4.0.0-rc.2
+yarn add primevue
 
 # Using pnpm
-pnpm add primevue@4.0.0-rc.2
+pnpm add primevue
 `
             }
         };
diff --git a/apps/showcase/doc/vite/StyledModeDoc.vue b/apps/showcase/doc/vite/StyledModeDoc.vue
index 4fed95c55..69bc1db1d 100644
--- a/apps/showcase/doc/vite/StyledModeDoc.vue
+++ b/apps/showcase/doc/vite/StyledModeDoc.vue
@@ -15,13 +15,13 @@ export default {
             code1: {
                 basic: `
 # Using npm
-npm install @primevue/themes@4.0.0-rc.2
+npm install @primevue/themes
 
 # Using yarn
-yarn add @primevue/themes@4.0.0-rc.2
+yarn add @primevue/themes
 
 # Using pnpm
-pnpm add @primevue/themes@4.0.0-rc.2
+pnpm add @primevue/themes
 `
             },
             code2: {
diff --git a/apps/showcase/doc/vite/UnstyledModeDoc.vue b/apps/showcase/doc/vite/UnstyledModeDoc.vue
index 1432de212..cb1449b99 100644
--- a/apps/showcase/doc/vite/UnstyledModeDoc.vue
+++ b/apps/showcase/doc/vite/UnstyledModeDoc.vue
@@ -4,10 +4,6 @@
             In unstyled mode, the components do not include any CSS so you'd need to style the components on your end, this is especially useful when building your own UI library on top of PrimeVue. Visit the
             <NuxtLink to="/theming/unstyled">Unstyled mode</NuxtLink> documentation for more information and examples.
         </p>
-        <p>
-            If you are using Tailwind CSS and prefer to have full control over the component styling, visit the <a href="https://tailwind.primevue.org/vite/">Tailwind CSS Presets</a> project to get you started with styling the components with
-            Tailwind utility classes.
-        </p>
         <DocSectionCode :code="code1" hideToggleCode importCode hideStackBlitz />
     </DocSectionText>
 </template>
diff --git a/apps/showcase/pages/nuxt/index.vue b/apps/showcase/pages/nuxt/index.vue
index 1cccced5b..5bed8b46e 100644
--- a/apps/showcase/pages/nuxt/index.vue
+++ b/apps/showcase/pages/nuxt/index.vue
@@ -18,9 +18,12 @@
 </template>
 
 <script>
+import AutoImportDoc from '@/doc/nuxt/AutoImportDoc.vue';
 import DownloadDoc from '@/doc/nuxt/DownloadDoc.vue';
 import ExamplesDoc from '@/doc/nuxt/ExamplesDoc.vue';
 import SetupDoc from '@/doc/nuxt/SetupDoc.vue';
+import StyledModeDoc from '@/doc/nuxt/StyledModeDoc.vue';
+import UnstyledModeDoc from '@/doc/nuxt/UnstyledModeDoc.vue';
 import UsageDoc from '@/doc/nuxt/UsageDoc.vue';
 import ComponentsDoc from '@/doc/nuxt/configuration/ComponentsDoc.vue';
 import ComposablesDoc from '@/doc/nuxt/configuration/ComposablesDoc.vue';
@@ -44,6 +47,23 @@ export default {
                     label: 'Setup',
                     component: SetupDoc
                 },
+                {
+                    id: 'theming',
+                    label: 'Theming',
+                    description: 'PrimeVue has two styling modes; Styled and Unstyled. If you are just getting started, begin with the styled mode.',
+                    children: [
+                        {
+                            id: 'styled',
+                            label: 'Styled Mode',
+                            component: StyledModeDoc
+                        },
+                        {
+                            id: 'unstyled',
+                            label: 'Unstyled Mode',
+                            component: UnstyledModeDoc
+                        }
+                    ]
+                },
                 {
                     id: 'usage',
                     label: 'Usage',
@@ -63,6 +83,21 @@ export default {
                             label: 'options',
                             component: OptionsDoc
                         },
+                        {
+                            id: 'autoimport',
+                            label: 'autoImport',
+                            component: AutoImportDoc
+                        },
+                        {
+                            id: 'importpt',
+                            label: 'importPT',
+                            component: ImportPTDoc
+                        },
+                        {
+                            id: 'importtheme',
+                            label: 'importTheme',
+                            component: ImportThemeDoc
+                        },
                         {
                             id: 'components',
                             label: 'components',
@@ -77,16 +112,6 @@ export default {
                             id: 'composables',
                             label: 'composables',
                             component: ComposablesDoc
-                        },
-                        {
-                            id: 'importpt',
-                            label: 'importPT',
-                            component: ImportPTDoc
-                        },
-                        {
-                            id: 'importtheme',
-                            label: 'importTheme',
-                            component: ImportThemeDoc
                         }
                     ]
                 },
diff --git a/packages/nuxt-module/src/module.ts b/packages/nuxt-module/src/module.ts
index 61e107269..f27606a30 100644
--- a/packages/nuxt-module/src/module.ts
+++ b/packages/nuxt-module/src/module.ts
@@ -16,7 +16,7 @@ export default defineNuxtModule<ModuleOptions>({
     },
     defaults: {
         usePrimeVue: true,
-        autoImport: false,
+        autoImport: true,
         resolvePath: undefined,
         //cssLayerOrder: undefined,
         importPT: undefined,
