[Bug Report] vite plugin - missing vuetify components when autoImport is false

When running vite plugin with vuetify({ styles: 'expose', autoImport: false }),

Importing components this way:

  import { VApp, VMain, VAppBar, VImg, VRow, VCol, VContainer } from 'vuetify';

Ends up with browser error:

Uncaught SyntaxError: The requested module '/node_modules/.vite/vuetify.js?v=7bedb03f' does not provide an export named 'VApp'

While importing from vuetify/dist produces following error:

11:29:22 AM [vite] Internal server error: Failed to resolve import "vuetify/dist" from "src/App.vue". Does the file exist?
  Plugin: vite:import-analysis
  File: /home/lromanowicz/projects/frontend/src/App.vue
  1  |  import { defineComponent } from "vue";
  2  |  import { VApp, VMain, VAppBar, VImg, VRow, VCol, VContainer } from "vuetify/dist";
     |                                                                      ^
  3  |  import { useAuth, LOGOUT_URL } from "./composables/useAuth";
  4  |  import Icon from "./components/atoms/Icon.vue";
      at formatError (/home/lromanowicz/projects/frontend/node_modules/vite/dist/node/chunks/dep-0ed4fbc0.js:44595:46)

Plugin 1.0.0-alpha.2 Vuetify 3.0.0-alpha.11 Vite 2.3.8

[KaelWD]

@use 'vuetify/lib/styles/main.sass'; should work

Keep in mind that this currently will not be picked up by the vite plugin, so customisations to any variables used in components won’t be applied.

[KaelWD]

https://youtrack.jetbrains.com/issue/WEB-40509

Weird that you’re getting that in a typescript file though, I only got it with js. What version of webstorm is that?

does not provide an export named ‘effectScope’

You need to update Vue