shadcn-nuxt 2.3.2 → 2.4.0

package/README.md

@@ -64,6 +64,28 @@ export default defineNuxtConfig({
 
 That's it! You can now use Shadcn Nuxt in your Nuxt app ✨
 
+### Multiple component directories
+
+Projects that split their base UI components from custom extensions can configure multiple directories, each with its own optional prefix:
+
+```ts
+export default defineNuxtConfig({
+  modules: ['shadcn-nuxt'],
+  shadcn: {
+    prefix: 'Ui',
+    componentDir: [
+      '@/components/ui',
+      {
+        path: '@/components/ai',
+        prefix: 'Ai',
+      },
+    ],
+  },
+})
+```
+
+Each directory is ignored by Nuxt's default auto-import scanning and re-registered through the module, ensuring clean separation without console warnings. See [issue #1593](https://github.com/unovue/shadcn-vue/issues/1593) for the background.
+
 ## Development
 
 ```bash

package/dist/module.d.mts

@@ -1,5 +1,11 @@
 import * as _nuxt_schema from '@nuxt/schema';
 
+interface ComponentDirConfig {
+    path: string;
+    prefix?: string;
+}
+type ComponentDirInput = string | ComponentDirConfig;
+type ComponentDirOption = ComponentDirInput | ComponentDirInput[];
 interface ModuleOptions {
     /**
      * Prefix for all the imported component.
@@ -12,8 +18,9 @@ interface ModuleOptions {
      * @link https://nuxt.com/docs/api/nuxt-config#alias
      * @default "@/components/ui"
      */
-    componentDir?: string;
+    componentDir?: ComponentDirOption;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
-export { type ModuleOptions, _default as default };
+export { _default as default };
+export type { ComponentDirConfig, ComponentDirInput, ComponentDirOption, ModuleOptions };

package/dist/module.json

@@ -1,9 +1,9 @@
 {
   "name": "shadcn",
   "configKey": "shadcn",
-  "version": "2.3.2",
+  "version": "2.4.0",
   "builder": {
-    "@nuxt/module-builder": "1.0.1",
+    "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"
   }
 }

package/dist/module.mjs

@@ -3,6 +3,19 @@ import { join } from 'node:path';
 import { defineNuxtModule, createResolver, addComponentsDir, addComponent } from '@nuxt/kit';
 import { parseSync } from 'oxc-parser';
 
+function isComponentDirConfig(value) {
+  return typeof value === "object" && value !== null && "path" in value;
+}
+function normalizeComponentDirs(componentDir, fallbackPrefix) {
+  const dirs = Array.isArray(componentDir) ? componentDir : [componentDir];
+  return dirs.filter((dir) => Boolean(dir)).map((dir) => {
+    if (typeof dir === "string")
+      return { path: dir, prefix: fallbackPrefix };
+    if (isComponentDirConfig(dir))
+      return { path: dir.path, prefix: dir.prefix ?? fallbackPrefix };
+    throw new Error("Invalid componentDir entry provided to shadcn module.");
+  });
+}
 const module = defineNuxtModule({
   meta: {
     name: "shadcn",
@@ -13,49 +26,51 @@ const module = defineNuxtModule({
     componentDir: "@/components/ui"
   },
   async setup({ prefix, componentDir }, nuxt) {
-    const COMPONENT_DIR_PATH = componentDir;
     const ROOT_DIR_PATH = nuxt.options.rootDir;
     const { resolve, resolvePath } = createResolver(ROOT_DIR_PATH);
-    const componentsPath = await resolvePath(COMPONENT_DIR_PATH);
-    if (!existsSync(componentsPath)) {
-      console.warn(`Component directory does not exist: ${componentsPath}`);
-      return;
-    }
-    addComponentsDir({
-      path: componentsPath,
-      extensions: [],
-      ignore: ["**/*"]
-    }, {
-      prepend: true
-    });
-    try {
-      await Promise.all(readdirSync(componentsPath).map(async (dir) => {
-        try {
-          const filePath = await resolvePath(join(COMPONENT_DIR_PATH, dir, "index"), { extensions: [".ts", ".js"] });
-          const content = readFileSync(filePath, { encoding: "utf8" });
-          const ast = parseSync(filePath, content, {
-            sourceType: "module"
-          });
-          const exportedKeys = ast.program.body.filter((node) => node.type === "ExportNamedDeclaration").flatMap((node) => node.specifiers?.map((specifier) => specifier.exported?.name) || []).filter((key) => /^[A-Z]/.test(key));
-          exportedKeys.forEach((key) => {
-            addComponent({
-              name: `${prefix}${key}`,
-              // name of the component to be used in vue templates
-              export: key,
-              // (optional) if the component is a named (rather than default) export
-              filePath: resolve(filePath),
-              priority: 1
+    const normalizedDirs = normalizeComponentDirs(componentDir ?? "@/components/ui", prefix ?? "Ui");
+    await Promise.all(normalizedDirs.map(async ({ path, prefix: dirPrefix }) => {
+      const componentsPath = await resolvePath(path);
+      if (!existsSync(componentsPath)) {
+        console.warn(`Component directory does not exist: ${componentsPath}`);
+        return;
+      }
+      addComponentsDir({
+        path: componentsPath,
+        extensions: [],
+        ignore: ["**/*"]
+      }, {
+        prepend: true
+      });
+      try {
+        await Promise.all(readdirSync(componentsPath).map(async (dir) => {
+          try {
+            const filePath = await resolvePath(join(path, dir, "index"), { extensions: [".ts", ".js"] });
+            const content = readFileSync(filePath, { encoding: "utf8" });
+            const ast = parseSync(filePath, content, {
+              sourceType: "module"
             });
-          });
-        } catch (err) {
-          if (err instanceof Error)
-            console.warn("Module error: ", err.message);
-        }
-      }));
-    } catch (err) {
-      if (err instanceof Error)
-        console.warn(err.message);
-    }
+            const exportedKeys = ast.program.body.filter((node) => node.type === "ExportNamedDeclaration").flatMap((node) => node.specifiers?.map((specifier) => specifier.exported?.name) || []).filter((key) => /^[A-Z]/.test(key));
+            exportedKeys.forEach((key) => {
+              addComponent({
+                name: `${dirPrefix}${key}`,
+                // name of the component to be used in vue templates
+                export: key,
+                // (optional) if the component is a named (rather than default) export
+                filePath: resolve(filePath),
+                priority: 1
+              });
+            });
+          } catch (err) {
+            if (err instanceof Error)
+              console.warn("Module error: ", err.message);
+          }
+        }));
+      } catch (err) {
+        if (err instanceof Error)
+          console.warn(err.message);
+      }
+    }));
   }
 });
 

package/dist/types.d.mts

@@ -1 +1,3 @@
-export { type ModuleOptions, default } from './module.mjs'
+export { default } from './module.mjs'
+
+export { type ComponentDirConfig, type ComponentDirInput, type ComponentDirOption, type ModuleOptions } from './module.mjs'

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "shadcn-nuxt",
   "type": "module",
-  "version": "2.3.2",
+  "version": "2.4.0",
   "description": "Add shadcn-vue module to Nuxt",
   "publishConfig": {
     "access": "public"
@@ -24,18 +24,18 @@
   ],
   "dependencies": {
     "@nuxt/kit": "^3.17.4",
-    "oxc-parser": "^0.93.0"
+    "oxc-parser": "^0.99.0"
   },
   "devDependencies": {
     "@nuxt/eslint-config": "^1.4.1",
-    "@nuxt/module-builder": "^1.0.1",
+    "@nuxt/module-builder": "^1.0.2",
     "@nuxt/schema": "^3.17.4",
     "@nuxt/test-utils": "^3.19.1",
     "@nuxtjs/color-mode": "^3.5.2",
     "@nuxtjs/tailwindcss": "^6.14.0",
-    "@types/node": "^22",
+    "@types/node": "^24",
     "nuxt": "^3.17.4",
-    "typescript": "^5.8.3"
+    "typescript": "^5.9.3"
   },
   "scripts": {
     "build": "nuxt-module-build prepare && nuxt-module-build build",