[Vite, Nuxt3, Vuetify3] styles: 'expose' | This variable was not declared with !default in the @used module.

[MichaelGitArt]

Environment Vuetify Version: "3.0.0-beta.4" Nuxt Version: "3.0.0-rc.4" vite-plugin-vuetify: "1.0.0-alpha.12" Browsers: Chrome 102.0.0.0 OS: MacOS 12.3.1

Desc Styles loading is incredibly long and it throws errors with styles: 'expose'

vuetify({ styles: 'expose', }),

Steps to reproduce Just install deps and 'yarn dev`.

Actual Behavior Styles are loading very long. 15+ seconds and fails few errors and then works well. In browsers error:

Terminal errors:

Reproduction Link https://github.com/MichaelGitArt/vite-plugin-vuetify-issue

[Sopamo]

I think that it takes a long time to load initially, is to be expected, because the styles have to be compiled. I do however get the same error message with this code:

// main.scss
@use 'vuetify/styles' with (
  $btn-sizes: (
    'default': 50,
    'large': 54
  )
);

[Sopamo]

Update: While the documentation says, that the variable is called $btn-sizes, that's apparently actually not how it works in vuetify 3 (maybe that part of the documentation is not yet migrated from vuetify 2). Changing the button size actually works perfectly when using the correct variable name:

// main.scss
@use 'vuetify/styles' with (
  $button-height: 50px
);

For anyone else having this issue, I'd suggest having a look at the vuetify source code to see how exactly the variables are named and used.