fix: wrong import directives (#120)

userquin · Oct 9, 2023 · 142197c · 142197c
1 parent 48898b5
commit 142197c
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/playground/vuetify.config.mts b/playground/vuetify.config.mts
@@ -8,7 +8,7 @@ export default defineVuetifyConfiguration({
   aliases: {
     MyBadge: 'VBadge',
   },
-  directives: true,
+  directives: ['ClickOutside', 'Resize', 'Ripple'],
   components: ['VDialog', 'VExpansionPanel', 'VExpansionPanelText', 'VExpansionPanelTitle'],
   labComponents: ['VDataTable', 'VDatePickerControls', 'VDatePickerHeader'],
   blueprint: md3,

diff --git a/src/vite/vuetify-configuration-plugin.ts b/src/vite/vuetify-configuration-plugin.ts
@@ -1,6 +1,7 @@
 import type { Plugin } from 'vite'
 import type { ComponentName, LabComponentName } from '../types'
 import type { VuetifyNuxtContext } from '../utils/config'
+import { toKebabCase } from '../utils'
 import { RESOLVED_VIRTUAL_VUETIFY_CONFIGURATION, VIRTUAL_VUETIFY_CONFIGURATION } from './constants'
 
 interface ImportsResult {
@@ -115,8 +116,8 @@ async function buildConfiguration(ctx: VuetifyNuxtContext) {
       config.directives = 'options.directives = directives'
     }
     else {
-      const useDirectives = Array.isArray(directives) ? [...new Set(...directives)] : [directives]
-      config.imports.push(useDirectives.map(d => `import { ${d} } from 'vuetify/directives/${d}'`).join('\n'))
+      const useDirectives = Array.isArray(directives) ? [...new Set(directives)] : [directives]
+      config.imports.push(useDirectives.map(d => `import {${d}} from 'vuetify/directives/${toKebabCase(d)}'`).join('\n'))
       config.directives = `options.directives = {${useDirectives.join(',')}}`
     }
   }