vuetify-nuxt-module 0.4.6 → 0.4.8

package/README.md

@@ -1,99 +1,99 @@
-<div align="center">
-<picture>
-  <source media="(prefers-color-scheme: dark)" srcset="https://github.com/userquin/vuetify-nuxt-module/raw/main/hero-dark.svg" />
-  <img alt="vuetify-nuxt-module - Zero-config Nuxt module for Vuetify" src='https://github.com/userquin/vuetify-nuxt-module/raw/main/hero.svg' alt="vuetify-nuxt-module - Zero-config Nuxt module for Vuetify"><br>
-</picture>
-<p>Zero-config Nuxt module for Vuetify</p>
-</div>
-
-<p align='center'>
-<a href='https://www.npmjs.com/package/vuetify-nuxt-module' target="__blank">
-<img src='https://img.shields.io/npm/v/vuetify-nuxt-module?color=33A6B8&label=' alt="NPM version">
-</a>
-<a href="https://www.npmjs.com/package/vuetify-nuxt-module" target="__blank">
-    <img alt="NPM Downloads" src="https://img.shields.io/npm/dm/vuetify-nuxt-module?color=476582&label=">
-</a>
-<a href="https://vuetify-nuxt-module.netlify.app/" target="__blank">
-    <img src="https://img.shields.io/static/v1?label=&message=docs%20%26%20guides&color=2e859c" alt="Docs & Guides">
-</a>
-<br>
-<a href="https://github.com/userquin/vuetify-nuxt-module" target="__blank">
-<img alt="GitHub stars" src="https://img.shields.io/github/stars/userquin/vuetify-nuxt-module?style=social">
-</a>
-</p>
-
-<br>
-
-## 🚀 Features
-
-- 📖 [**Documentation & guides**](https://vuetify-nuxt-module.netlify.app/)
-- 👌 **Zero-Config**: sensible built-in default [Vuetify](https://vuetifyjs.com/) configuration for common use cases
-- 🔌 **Extensible**: expose the ability to customize the Vuetify configuration via [Nuxt Plugin Hooks](https://nuxt.com/docs/guide/going-further/hooks#usage-with-plugins)
-- ⚡ **Fully Tree Shakable**: by default, only the needed Vuetify components are imported
-- 🛠️ **Versatile**: custom Vuetify [directives](https://vuetifyjs.com/en/getting-started/installation/#manual-steps) and [labs components](https://vuetifyjs.com/en/labs/introduction/) registration
-- ✨ **Configurable Styles**: configure your variables using [Vuetify SASS Variables](https://vuetifyjs.com/en/features/sass-variables/) 
-- 💥 **SSR**: automatic SSR detection and configuration
-- 🔥 **Pure CSS Icons**: no more font/js icons, use the new `unocsss-mdi` icon set or build your own with UnoCSS Preset Icons
-- 😃 **Icon Fonts**: configure the [icon font](https://vuetifyjs.com/en/features/icon-fonts/) you want to use, the module will automatically import it for you using CDN or local dependencies
-- 🎭 **SVG Icons**: ready to use [@mdi/js](https://www.npmjs.com/package/@mdi/js) and [@fortawesome/vue-fontawesome](https://www.npmjs.com/package/@fortawesome/vue-fontawesome) SVG icons packs
-- 📦 **Multiple Icon Sets**: register [multiple icon sets](https://vuetifyjs.com/en/features/icon-fonts/#multiple-icon-sets)
-- 🌍 **I18n Ready**: install [@nuxtjs/i18n](https://v8.i18n.nuxtjs.org/) Nuxt module, and you're ready to use Vuetify [internationalization](https://vuetifyjs.com/en/features/internationalization/) features
-- 📆 **Date Components**: use Vuetify components [that require date functionality](https://vuetifyjs.com/en/features/dates/) installing and configuring one of the [@date-io](https://github.com/dmtrKovalenko/date-io#projects) adapters
-- ⚙️ **Auto-Import Vuetify Composables**: you don't need to import Vuetify composables manually, they are automatically imported for you
-- 🎨 **Vuetify Blueprints**: use [Vuetify Blueprints](https://vuetifyjs.com/en/features/blueprints/) to quickly scaffold components
-- 🔩 **Nuxt Layers and Hooks**: load your Vuetify configuration using [Nuxt Layers](https://nuxt.com/docs/getting-started/layers#layers) or using a custom module via `vuetify:registerModule` [Nuxt Hook](https://nuxt.com/docs/guide/going-further/hooks#nuxt-hooks-build-time)
-- 👀 **Nuxt DevTools**: ready to inspect your Vuetify styles with the [Nuxt DevTools](https://github.com/nuxt/devtools) inspector
-- 🦾 **Type Strong**: written in [TypeScript](https://www.typescriptlang.org/)
-
-## 📦 Install
-
-> Requires Vite, will not work with Webpack
-
-```bash
-npm i vuetify-nuxt-module -D 
-
-# yarn 
-yarn add vuetify-nuxt-module -D
-
-# pnpm 
-pnpm add vuetify-nuxt-module -D
-```
-
-[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/userquin/vuetify-nuxt-module)
-
-## 🦄 Usage
-
-> `vuetify-nuxt-module` is strongly opinionated and has a built-in default configuration out of the box. You can use it without any configuration, and it will work for most use cases.
-
-Add `vuetify-nuxt-module` module to `nuxt.config.ts` and configure it:
-
-```ts
-// Nuxt config file
-import { defineNuxtConfig } from 'nuxt/config'
-
-export default defineNuxtConfig({
-  modules: [
-    'vuetify-nuxt-module'
-  ],
-  vuetify: {
-    moduleOptions: {
-      /* module specific options */
-    },
-    vuetifyOptions: {
-      /* vuetify options */
-    }
-  }
-})
-```
-
-Read the [📖 documentation](https://vuetify-nuxt-module.netlify.app/) for a complete guide on how to configure and use this module.
-
-## 👀 Full config
-
-Check out the [types](https://github.com/userquin/vuetify-nuxt-module/blob/main/src/types.ts).
-
-The virtual modules can be found in [configuration.d.ts](https://github.com/userquin/vuetify-nuxt-module/blob/main/configuration.d.ts) file.
-
-## 📄 License
-
-[MIT](https://github.com/userquin/vuetify-nuxt-module/blob/main/LICENSE) License &copy; 2023-PRESENT [Joaquín Sánchez](https://github.com/userquin)
+<div align="center">
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://github.com/userquin/vuetify-nuxt-module/raw/main/hero-dark.svg" />
+  <img alt="vuetify-nuxt-module - Zero-config Nuxt module for Vuetify" src='https://github.com/userquin/vuetify-nuxt-module/raw/main/hero.svg' alt="vuetify-nuxt-module - Zero-config Nuxt module for Vuetify"><br>
+</picture>
+<p>Zero-config Nuxt module for Vuetify</p>
+</div>
+
+<p align='center'>
+<a href='https://www.npmjs.com/package/vuetify-nuxt-module' target="__blank">
+<img src='https://img.shields.io/npm/v/vuetify-nuxt-module?color=33A6B8&label=' alt="NPM version">
+</a>
+<a href="https://www.npmjs.com/package/vuetify-nuxt-module" target="__blank">
+    <img alt="NPM Downloads" src="https://img.shields.io/npm/dm/vuetify-nuxt-module?color=476582&label=">
+</a>
+<a href="https://vuetify-nuxt-module.netlify.app/" target="__blank">
+    <img src="https://img.shields.io/static/v1?label=&message=docs%20%26%20guides&color=2e859c" alt="Docs & Guides">
+</a>
+<br>
+<a href="https://github.com/userquin/vuetify-nuxt-module" target="__blank">
+<img alt="GitHub stars" src="https://img.shields.io/github/stars/userquin/vuetify-nuxt-module?style=social">
+</a>
+</p>
+
+<br>
+
+## 🚀 Features
+
+- 📖 [**Documentation & guides**](https://vuetify-nuxt-module.netlify.app/)
+- 👌 **Zero-Config**: sensible built-in default [Vuetify](https://vuetifyjs.com/) configuration for common use cases
+- 🔌 **Extensible**: expose the ability to customize the Vuetify configuration via [Nuxt Plugin Hooks](https://nuxt.com/docs/guide/going-further/hooks#usage-with-plugins)
+- ⚡ **Fully Tree Shakable**: by default, only the needed Vuetify components are imported
+- 🛠️ **Versatile**: custom Vuetify [directives](https://vuetifyjs.com/en/getting-started/installation/#manual-steps) and [labs components](https://vuetifyjs.com/en/labs/introduction/) registration
+- ✨ **Configurable Styles**: configure your variables using [Vuetify SASS Variables](https://vuetifyjs.com/en/features/sass-variables/) 
+- 💥 **SSR**: automatic SSR detection and configuration
+- 🔥 **Pure CSS Icons**: no more font/js icons, use the new `unocss-mdi` icon set or build your own with UnoCSS Preset Icons
+- 😃 **Icon Fonts**: configure the [icon font](https://vuetifyjs.com/en/features/icon-fonts/) you want to use, the module will automatically import it for you using CDN or local dependencies
+- 🎭 **SVG Icons**: ready to use [@mdi/js](https://www.npmjs.com/package/@mdi/js) and [@fortawesome/vue-fontawesome](https://www.npmjs.com/package/@fortawesome/vue-fontawesome) SVG icons packs
+- 📦 **Multiple Icon Sets**: register [multiple icon sets](https://vuetifyjs.com/en/features/icon-fonts/#multiple-icon-sets)
+- 🌍 **I18n Ready**: install [@nuxtjs/i18n](https://v8.i18n.nuxtjs.org/) Nuxt module, and you're ready to use Vuetify [internationalization](https://vuetifyjs.com/en/features/internationalization/) features
+- 📆 **Date Components**: use Vuetify components [that require date functionality](https://vuetifyjs.com/en/features/dates/) installing and configuring one of the [@date-io](https://github.com/dmtrKovalenko/date-io#projects) adapters
+- ⚙️ **Auto-Import Vuetify Composables**: you don't need to import Vuetify composables manually, they are automatically imported for you
+- 🎨 **Vuetify Blueprints**: use [Vuetify Blueprints](https://vuetifyjs.com/en/features/blueprints/) to quickly scaffold components
+- 🔩 **Nuxt Layers and Hooks**: load your Vuetify configuration using [Nuxt Layers](https://nuxt.com/docs/getting-started/layers#layers) or using a custom module via `vuetify:registerModule` [Nuxt Hook](https://nuxt.com/docs/guide/going-further/hooks#nuxt-hooks-build-time)
+- 👀 **Nuxt DevTools**: ready to inspect your Vuetify styles with the [Nuxt DevTools](https://github.com/nuxt/devtools) inspector
+- 🦾 **Type Strong**: written in [TypeScript](https://www.typescriptlang.org/)
+
+## 📦 Install
+
+> Requires Vite, will not work with Webpack
+
+```bash
+npm i vuetify-nuxt-module -D 
+
+# yarn 
+yarn add vuetify-nuxt-module -D
+
+# pnpm 
+pnpm add vuetify-nuxt-module -D
+```
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/userquin/vuetify-nuxt-module)
+
+## 🦄 Usage
+
+> `vuetify-nuxt-module` is strongly opinionated and has a built-in default configuration out of the box. You can use it without any configuration, and it will work for most use cases.
+
+Add `vuetify-nuxt-module` module to `nuxt.config.ts` and configure it:
+
+```ts
+// Nuxt config file
+import { defineNuxtConfig } from 'nuxt/config'
+
+export default defineNuxtConfig({
+  modules: [
+    'vuetify-nuxt-module'
+  ],
+  vuetify: {
+    moduleOptions: {
+      /* module specific options */
+    },
+    vuetifyOptions: {
+      /* vuetify options */
+    }
+  }
+})
+```
+
+Read the [📖 documentation](https://vuetify-nuxt-module.netlify.app/) for a complete guide on how to configure and use this module.
+
+## 👀 Full config
+
+Check out the [types](https://github.com/userquin/vuetify-nuxt-module/blob/main/src/types.ts).
+
+The virtual modules can be found in [configuration.d.ts](https://github.com/userquin/vuetify-nuxt-module/blob/main/configuration.d.ts) file.
+
+## 📄 License
+
+[MIT](https://github.com/userquin/vuetify-nuxt-module/blob/main/LICENSE) License &copy; 2023-PRESENT [Joaquín Sánchez](https://github.com/userquin)

package/dist/module.d.ts

@@ -1,6 +1,7 @@
 import * as _nuxt_schema from '@nuxt/schema';
 import * as vuetify from 'vuetify';
 import { VuetifyOptions, LocaleOptions, RtlOptions } from 'vuetify';
+import * as vuetify_locale from 'vuetify/locale';
 import * as vuetify_labs_components from 'vuetify/labs/components';
 import * as vuetify_directives from 'vuetify/directives';
 import * as vuetify_components from 'vuetify/components';
@@ -90,6 +91,7 @@ type DirectiveName = keyof typeof vuetify_directives;
 type Directives = boolean | DirectiveName | DirectiveName[];
 type LabComponentName = keyof typeof vuetify_labs_components;
 type LabComponents = boolean | LabComponentName | LabComponentName[];
+type VuetifyLocale = keyof typeof vuetify_locale;
 interface VOptions extends Partial<Omit<VuetifyOptions, 'ssr' | 'aliases' | 'components' | 'directives' | 'locale' | 'date' | 'icons'>> {
     aliases?: Record<string, ComponentName>;
     /**
@@ -105,10 +107,19 @@ interface VOptions extends Partial<Omit<VuetifyOptions, 'ssr' | 'aliases' | 'com
      * - `locale`
      * - `fallback`
      * - `rtl`
+     * - `messages`
      *
      * The adapter will be `vuetify`, if you want to use another adapter, check `date` option.
      */
     locale?: Omit<LocaleOptions, 'adapter'> & RtlOptions;
+    /**
+     * Include locale messages?
+     *
+     * When `@nuxtjs/i18n` Nuxt module is present, this option will be ignored.
+     *
+     * You can include the locales you want to use in your application, this module will load and configure the messages for you.
+     */
+    localeMessages?: VuetifyLocale | VuetifyLocale[];
     /**
      * Include the lab components?
      *
@@ -209,4 +220,4 @@ declare module '#app' {
 
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
 
-export { ComponentName, Components, DateAdapter, DateOptions, DirectiveName, Directives, FontAwesomeSvgIconSet, FontIconSet, IconFontName, IconSetName, IconsOptions, JSSVGIconSet, LabComponentName, LabComponents, MOptions, ModuleOptions, VOptions, _default as default };
+export { ComponentName, Components, DateAdapter, DateOptions, DirectiveName, Directives, FontAwesomeSvgIconSet, FontIconSet, IconFontName, IconSetName, IconsOptions, JSSVGIconSet, LabComponentName, LabComponents, MOptions, ModuleOptions, VOptions, VuetifyLocale, _default as default };

package/dist/module.json

@@ -4,5 +4,5 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "0.4.6"
+  "version": "0.4.8"
 }

package/dist/module.mjs

@@ -1,12 +1,12 @@
-import { utimes, readFile } from 'node:fs/promises';
 import { useLogger, defineNuxtModule, isNuxt3, getNuxtVersion, createResolver, hasNuxtModule, extendWebpackConfig, addImports, addPlugin } from '@nuxt/kit';
 import defu from 'defu';
+import { utimes, readFile } from 'node:fs/promises';
 import { resolveVuetifyBase, normalizePath, writeStyles, cacheDir } from '@vuetify/loader-shared';
 import { isAbsolute, join, relative } from 'pathe';
 import { normalizePath as normalizePath$1 } from 'vite';
 import { isPackageExists } from 'local-pkg';
 
-const version = "0.4.6";
+const version = "0.4.8";
 
 function isSubdir(root, test) {
   const relative$1 = relative(root, test);
@@ -184,11 +184,12 @@ const RESOLVED_VIRTUAL_VUETIFY_DATE_CONFIGURATION = `/@nuxt-vuetify-configuratio
 const VIRTUAL_VUETIFY_ICONS_CONFIGURATION = "virtual:vuetify-icons-configuration";
 const RESOLVED_VIRTUAL_VUETIFY_ICONS_CONFIGURATION = `/@nuxt-vuetify-configuration/${VIRTUAL_VUETIFY_ICONS_CONFIGURATION.slice("virtual:".length)}`;
 
-function vuetifyConfigurationPlugin(isDev, i18n, directives, labComponents, vuetifyAppOptions) {
+function vuetifyConfigurationPlugin(isDev, i18n, directives, labComponents, vuetifyAppOptions, componentsPromise, labComponentsPromise, logger) {
   const {
     directives: _directives,
     date: _date,
     icons: _icons,
+    localeMessages,
     components,
     aliases,
     ...newVuetifyOptions
@@ -207,7 +208,8 @@ function vuetifyConfigurationPlugin(isDev, i18n, directives, labComponents, vuet
           delete newVuetifyOptions.locale.locale;
           delete newVuetifyOptions.locale.fallback;
         }
-        const result = buildConfiguration();
+        const result = await buildConfiguration();
+        const deepCopy = result.messages.length > 0;
         return `${result.imports}
 
 export const isDev = ${isDev}
@@ -216,13 +218,26 @@ export function vuetifyConfiguration() {
   ${result.directives}
   ${result.aliases}
   ${result.components}
+  ${result.messages}
   return options
 }
+${deepCopy ? `function deepCopy(src,des) {
+    for (const key in src) {
+      if (typeof src[key] === 'object') {
+        if (!typeof des[key] === 'object') des[key] = {}
+        deepCopy(src[key], des[key])
+      } else {
+        des[key] = src[key]
+      }
+    }
+    return des
+  }
+  ` : ""}
 `;
       }
     }
   };
-  function buildConfiguration() {
+  async function buildConfiguration() {
     const dateOptions = vuetifyAppOptions.date;
     const config = {
       directives: "",
@@ -230,44 +245,103 @@ export function vuetifyConfiguration() {
       aliasEntries: [],
       aliases: aliases || {},
       components: new Set(components ? Array.isArray(components) ? components : [components] : []),
-      labComponents: /* @__PURE__ */ new Set()
+      labComponents: /* @__PURE__ */ new Set(),
+      messages: ""
     };
     if (directives) {
       if (typeof directives === "boolean") {
         config.imports.push("import * as directives from 'vuetify/directives'");
         config.directives = "options.directives = directives";
       } else {
-        const useDirectives = Array.isArray(directives) ? directives : [directives];
+        const useDirectives = Array.isArray(directives) ? [...new Set(...directives)] : [directives];
         config.imports.push(useDirectives.map((d) => `import { ${d} } from 'vuetify/directives/${d}'`).join("\n"));
         config.directives = `options.directives = {${useDirectives.join(",")}}`;
       }
     }
-    config.imports.push(...Array.from(config.components).map((c) => `import {${c}} from 'vuetify/components/${c}'`));
+    const importMapComponents = await componentsPromise;
+    const componentsToImport = /* @__PURE__ */ new Map();
+    config.components.forEach((component) => {
+      const { from } = importMapComponents[component];
+      if (!from) {
+        logger.warn(`Component ${component} not found in Vuetify.`);
+        return;
+      }
+      const parts = from.split("/");
+      if (parts.length < 2) {
+        logger.warn(`Component ${component} not found in Vuetify, please report a new issue.`);
+        return;
+      }
+      if (!componentsToImport.has(parts[1]))
+        componentsToImport.set(parts[1], []);
+      const componentsArray = componentsToImport.get(parts[1]);
+      if (!componentsArray.includes(component))
+        componentsArray.push(component);
+    });
     Object.entries(config.aliases).forEach(([key, component]) => {
-      if (!config.components.has(component)) {
-        config.components.add(component);
-        config.imports.push(`import {${component}} from 'vuetify/components/${component}'`);
+      const { from } = importMapComponents[component];
+      if (!from) {
+        logger.warn(`Component ${component} not found in Vuetify.`);
+        return;
       }
+      const parts = from.split("/");
+      if (parts.length < 2) {
+        logger.warn(`Component ${component} not found in Vuetify, please report a new issue.`);
+        return;
+      }
+      if (!componentsToImport.has(parts[1]))
+        componentsToImport.set(parts[1], []);
+      const componentsArray = componentsToImport.get(parts[1]);
+      if (!componentsArray.includes(component))
+        componentsArray.push(component);
       config.aliasEntries.push(`'${key}': ${component}`);
     });
+    componentsToImport.forEach((componentsArray, from) => {
+      config.imports.push(`import {${componentsArray.join(",")}} from 'vuetify/components/${from}'`);
+    });
     let addDatePicker = true;
     if (labComponents) {
+      const useLabComponents = [];
       if (typeof labComponents === "boolean") {
         config.imports.push("import * as labsComponents from 'vuetify/labs/components'");
         config.labComponents.add("*");
         addDatePicker = false;
+      } else if (typeof labComponents === "string") {
+        useLabComponents.push(labComponents);
       } else if (Array.isArray(labComponents)) {
-        labComponents.forEach((labComponent) => {
-          if (!config.labComponents.has(labComponent)) {
-            config.labComponents.add(labComponent);
-            config.imports.push(`import {${labComponent}} from 'vuetify/labs/${labComponent}'`);
+        useLabComponents.push(...labComponents);
+      }
+      if (useLabComponents.length) {
+        componentsToImport.clear();
+        const importMapLabComponents = await labComponentsPromise;
+        useLabComponents.forEach((component) => {
+          const { from } = importMapLabComponents[component];
+          if (!from) {
+            logger.warn(`Lab Component ${component} not found in Vuetify.`);
+            return;
+          }
+          const parts = from.split("/");
+          if (parts.length < 2) {
+            logger.warn(`Lab Component ${component} not found in Vuetify, please report a new issue.`);
+            return;
+          }
+          if (!componentsToImport.has(parts[1]))
+            componentsToImport.set(parts[1], []);
+          const componentsArray = componentsToImport.get(parts[1]);
+          if (!componentsArray.includes(component))
+            componentsArray.push(component);
+          config.labComponents.add(component);
+        });
+        if (dateOptions && !config.labComponents.has("VDatePicker")) {
+          const entry = componentsToImport.get("VDatePicker");
+          if (entry) {
+            entry.push("VDatePicker");
+            config.labComponents.add("VDatePicker");
           }
+        }
+        componentsToImport.forEach((componentsArray, from) => {
+          config.imports.push(`import {${componentsArray.join(",")}} from 'vuetify/labs/${from}'`);
         });
         addDatePicker = !config.labComponents.has("VDatePicker");
-      } else {
-        config.imports.push(`import {${labComponents}} from 'vuetify/labs/${labComponents}'`);
-        config.labComponents.add(labComponents);
-        addDatePicker = labComponents !== "VDatePicker";
       }
     }
     if (dateOptions && addDatePicker) {
@@ -290,11 +364,31 @@ export function vuetifyConfiguration() {
       else
         componentsEntry = `options.components = {${Array.from(config.labComponents).join(",")}}`;
     }
+    if (
+      /*! i18n && */
+      localeMessages
+    ) {
+      const useLocales = Array.isArray(localeMessages) ? [.../* @__PURE__ */ new Set([...localeMessages])] : [localeMessages];
+      config.imports.push(`import {${useLocales.join(",")}} from 'vuetify/locale'`);
+      config.messages = `
+  options.locale = options.locale || {}
+  options.locale.messages = options.locale.messages || {}
+${useLocales.map((locale) => {
+        return `
+  if ('${locale}' in options.locale.messages)
+    options.locale.messages['${locale}'] = deepCopy(options.locale.messages['${locale}'],${locale})
+  else
+    options.locale.messages['${locale}'] = ${locale}
+`;
+      }).join("")}
+`;
+    }
     return {
       imports: config.imports.length ? config.imports.join("\n") : "",
       components: componentsEntry,
       aliases: config.aliasEntries.length ? `options.aliases = {${config.aliasEntries.join(",")}}` : "",
-      directives: config.directives
+      directives: config.directives,
+      messages: config.messages
     };
   }
 }
@@ -617,6 +711,19 @@ toKebabCase.cache = /* @__PURE__ */ new Map();
 
 function detectDate() {
   const result = [];
+  [
+    "date-fns",
+    "moment",
+    "luxon",
+    "dayjs",
+    "js-joda",
+    "date-fns-jalali",
+    "jalaali",
+    "hijri"
+  ].forEach((adapter) => {
+    if (isPackageExists(`@date-io/${adapter}`))
+      result.push(adapter);
+  });
   return result;
 }
 function cleanupBlueprint(vuetifyOptions) {
@@ -631,6 +738,30 @@ function cleanupBlueprint(vuetifyOptions) {
     vuetifyOptions.blueprint = blueprint;
   }
 }
+function checkVuetifyPlugins(config) {
+  let plugin = config.plugins?.find((p) => p && typeof p === "object" && "name" in p && p.name === "vuetify:import");
+  if (plugin)
+    throw new Error("Remove vite-plugin-vuetify plugin from Vite Plugins entry in Nuxt config file!");
+  plugin = config.plugins?.find((p) => p && typeof p === "object" && "name" in p && p.name === "vuetify:styles");
+  if (plugin)
+    throw new Error("Remove vite-plugin-vuetify plugin from Vite Plugins entry in Nuxt config file!");
+}
+function resolveVuetifyComponents(resolver) {
+  const vuetifyBase = resolveVuetifyBase();
+  const componentsPromise = importMapResolver();
+  const labComponentsPromise = importMapLabResolver();
+  return {
+    vuetifyBase,
+    componentsPromise,
+    labComponentsPromise
+  };
+  async function importMapResolver() {
+    return JSON.parse(await readFile(resolver.resolve(vuetifyBase, "dist/json/importMap.json"), "utf-8")).components;
+  }
+  async function importMapLabResolver() {
+    return JSON.parse(await readFile(resolver.resolve(vuetifyBase, "dist/json/importMap-labs.json"), "utf-8")).components;
+  }
+}
 
 async function mergeVuetifyModules(options, nuxt) {
   const moduleOptions = [];
@@ -723,7 +854,7 @@ const module = defineNuxtModule({
       nuxt.options.css.unshift("vuetify/styles/main.sass");
     else if (styles === true)
       nuxt.options.css.unshift("vuetify/styles");
-    else if (typeof styles === "object" && styles?.configFile && typeof styles.configFile === "string")
+    else if (typeof styles === "object" && typeof styles?.configFile === "string")
       nuxt.options.css.unshift(styles.configFile);
     if (icons.enabled) {
       icons.local?.forEach((css) => nuxt.options.css.push(css));
@@ -744,9 +875,13 @@ const module = defineNuxtModule({
     nuxt.hook("prepare:types", ({ references }) => {
       references.push({ types: "vuetify-nuxt-module/configuration" });
     });
+    const {
+      vuetifyBase,
+      componentsPromise,
+      labComponentsPromise
+    } = resolveVuetifyComponents(resolver);
     nuxt.hook("components:extend", async (c) => {
-      const vuetifyBase = resolveVuetifyBase();
-      const { components } = JSON.parse(await readFile(resolver.resolve(vuetifyBase, "dist/json/importMap.json"), "utf-8"));
+      const components = await componentsPromise;
       Object.keys(components).forEach((component) => {
         const from = components[component].from;
         c.push({
@@ -754,7 +889,7 @@ const module = defineNuxtModule({
           kebabName: toKebabCase(component),
           export: component,
           filePath: `${resolver.resolve(vuetifyBase, `lib/${from}`)}`,
-          shortPath: `components/${from}`,
+          shortPath: `vuetify/components/${from}`,
           chunkName: toKebabCase(component),
           prefetch: false,
           preload: false,
@@ -787,7 +922,10 @@ const module = defineNuxtModule({
         i18n,
         directives,
         labComponents,
-        vuetifyAppOptions
+        vuetifyAppOptions,
+        componentsPromise,
+        labComponentsPromise,
+        logger
       ));
       viteInlineConfig.plugins.push(vuetifyIconsPlugin(
         nuxt.options.dev,
@@ -821,13 +959,5 @@ const module = defineNuxtModule({
     }
   }
 });
-function checkVuetifyPlugins(config) {
-  let plugin = config.plugins?.find((p) => p && typeof p === "object" && "name" in p && p.name === "vuetify:import");
-  if (plugin)
-    throw new Error("Remove vite-plugin-vuetify plugin from Vite Plugins entry in Nuxt config file!");
-  plugin = config.plugins?.find((p) => p && typeof p === "object" && "name" in p && p.name === "vuetify:styles");
-  if (plugin)
-    throw new Error("Remove vite-plugin-vuetify plugin from Vite Plugins entry in Nuxt config file!");
-}
 
 export { module as default };

package/dist/types.d.ts

@@ -12,4 +12,4 @@ declare module 'nuxt/schema' {
 }
 
 
-export { ComponentName, Components, DateAdapter, DateOptions, DirectiveName, Directives, FontAwesomeSvgIconSet, FontIconSet, IconFontName, IconSetName, IconsOptions, JSSVGIconSet, LabComponentName, LabComponents, MOptions, ModuleOptions, VOptions, default } from './module'
+export { ComponentName, Components, DateAdapter, DateOptions, DirectiveName, Directives, FontAwesomeSvgIconSet, FontIconSet, IconFontName, IconSetName, IconsOptions, JSSVGIconSet, LabComponentName, LabComponents, MOptions, ModuleOptions, VOptions, VuetifyLocale, default } from './module'

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "vuetify-nuxt-module",
   "type": "module",
-  "version": "0.4.6",
-  "packageManager": "pnpm@8.6.8",
+  "version": "0.4.8",
+  "packageManager": "pnpm@8.6.9",
   "description": "Zero-Config Nuxt Module for Vuetify",
   "author": "userquin <userquin@gmail.com>",
   "license": "MIT",
@@ -59,13 +59,13 @@
   "peerDependencies": {
     "@nuxt/kit": "^3.6.2",
     "vite-plugin-vuetify": "^1.0.2",
-    "vuetify": "^3.3.6"
+    "vuetify": "^3.3.9"
   },
   "dependencies": {
     "@nuxt/kit": "^3.6.2",
     "defu": "^6.1.2",
     "vite-plugin-vuetify": "^1.0.2",
-    "vuetify": "^3.3.6"
+    "vuetify": "^3.3.9"
   },
   "devDependencies": {
     "@antfu/eslint-config": "^0.39.6",