diff --git a/docs/content/1.getting-started/2.installation.md b/docs/content/1.getting-started/2.installation.md index 15b803f6..1774227d 100644 --- a/docs/content/1.getting-started/2.installation.md +++ b/docs/content/1.getting-started/2.installation.md @@ -227,12 +227,13 @@ You can also add the following to your `.vscode/settings.json` to enable Intelli ## Options -| Key | Default | Description | -| ------------------------ | ---------------------- | ------------------------------------------------ | -| `prefix` | `u` | Define the prefix of the imported components. | -| `global` | `false` | Expose components globally. | -| `icons` | `['heroicons']` | Icon collections to load. | -| `safelistColors` | `['primary']` | Force safelisting of colors to need be purged. | +| Key | Default | Description | +|-----------------------|-----------------|-------------------------------------------------------------------------------------------------------------| +| `prefix` | `u` | Define the prefix of the imported components. | +| `global` | `false` | Expose components globally. | +| `icons` | `['heroicons']` | Icon collections to load. | +| `safelistColors` | `['primary']` | Force safelisting of colors to need be purged. | +| `disableGlobalStyles` | `false` | Disable [global CSS styles](https://github.com/nuxt/ui/blob/dev/src/runtime/ui.css) injected by the module. | Configure options in your `nuxt.config.ts` as such: diff --git a/src/module.ts b/src/module.ts index caa560db..2b70153a 100644 --- a/src/module.ts +++ b/src/module.ts @@ -54,6 +54,10 @@ export interface ModuleOptions { icons: CollectionNames[] | 'all' | IconsPluginOptions safelistColors?: string[] + /** + * Disables the global css styles added by the module. + */ + disableGlobalStyles?: boolean } export default defineNuxtModule({ @@ -68,7 +72,8 @@ export default defineNuxtModule({ defaults: { prefix: 'U', icons: ['heroicons'], - safelistColors: ['primary'] + safelistColors: ['primary'], + disableGlobalStyles: false }, async setup (options, nuxt) { const { resolve } = createResolver(import.meta.url) @@ -80,7 +85,9 @@ export default defineNuxtModule({ nuxt.options.alias['#ui'] = runtimeDir - nuxt.options.css.push(resolve(runtimeDir, 'ui.css')) + if (!options.disableGlobalStyles) { + nuxt.options.css.push(resolve(runtimeDir, 'ui.css')) + } // @ts-ignore nuxt.hook('tailwindcss:config', function (tailwindConfig) {