Skip to content

Commit 9236675

Browse files
authored
feat(labs): enable labs components auto-import by default (#309)
* feat(labs): enable labs components auto-import by default * chore: update faq info
1 parent b136e56 commit 9236675

File tree

4 files changed

+14
-6
lines changed

4 files changed

+14
-6
lines changed

docs/guide/faq.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,10 @@ This PR [fix(nuxt): support serialising rich server logs](https://github.com/nux
1515

1616
## Vuetify styles broken with Nuxt 3.16.0
1717

18+
::: info
19+
Fixed in Vuetify version `v3.8.0` (Andromeda).
20+
:::
21+
1822
If your Vuetify styles not being applied when using Nuxt 3.16.0, you can drop this module to your modules folder:
1923

2024
```ts

docs/guide/globals/index.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ The module will enable automatic tree shaking for Vuetify components.
55
You don't need to install any Vuetify Vite Plugin (the module will throw an error if any Vuetify Vite Plugin is installed in your Nuxt configuration):
66
- the module will provide auto-import support via `vuetify/dist/json/importMap.json` json file and Nuxt `components:extend` hook.
77
- the module will register a custom Vite Plugin for Vuetify styles: it is just a copy from the original Vuetify Vite Styles Plugin, changing some virtual names mappings and handling SSR flags.
8+
- from version `v0.18.6`, the module supports [Component Labs](https://vuetifyjs.com/en/labs/introduction/) auto-import.
89

910
You can register the following Vuetify components globally:
1011
- [Global Components](/guide/globals/global-components)

docs/guide/globals/lab-components.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ outline: deep
44

55
# Lab Components
66

7+
::: info
8+
From version `v0.18.6`, the module supports [labs components](https://vuetifyjs.com/en/labs/introduction/) auto-import, you can use them on demand.
9+
:::
10+
711
The module provides support to use Vuetify [labs components](https://vuetifyjs.com/en/labs/introduction/) via `vuetifyOptions.labsComponents` module option, it has been declared properly to have better DX.
812

913
You can register all the lab components or only the ones you need: check the [lab component definition](https://github.com/vuetifyjs/nuxt-module/blob/main/src/types.ts#L140-L141).

src/utils/configure-vite.ts

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { Nuxt } from '@nuxt/schema'
22
import defu from 'defu'
3-
import type { Options } from '@vuetify/loader-shared'
3+
import type { ObjectImportPluginOptions } from '@vuetify/loader-shared'
44
import { isPackageExists } from 'local-pkg'
55
import { vuetifyStylesPlugin } from '../vite/vuetify-styles-plugin'
66
import { vuetifyConfigurationPlugin } from '../vite/vuetify-configuration-plugin'
@@ -70,17 +70,16 @@ export function configureVite(configKey: string, nuxt: Nuxt, ctx: VuetifyNuxtCon
7070
}
7171
}
7272

73-
// fix #236
74-
const vuetifyImportOptions: Options = {}
73+
const autoImport: ObjectImportPluginOptions = { labs: true }
7574
const ignoreDirectives = ctx.moduleOptions.ignoreDirectives
75+
// fix #236
7676
if (ignoreDirectives) {
77-
const ignore = Array.isArray(ignoreDirectives)
77+
autoImport.ignore = Array.isArray(ignoreDirectives)
7878
? ignoreDirectives
7979
: [ignoreDirectives]
80-
vuetifyImportOptions.autoImport = { ignore }
8180
}
8281

83-
viteInlineConfig.plugins.push(vuetifyImportPlugin(vuetifyImportOptions))
82+
viteInlineConfig.plugins.push(vuetifyImportPlugin({ autoImport }))
8483
// exclude styles plugin
8584
if (typeof ctx.moduleOptions.styles !== 'boolean')
8685
viteInlineConfig.plugins.push(vuetifyStylesPlugin({ styles: ctx.moduleOptions.styles }, ctx.viteVersion, ctx.logger))

0 commit comments

Comments
 (0)