[Bug Report][3.1.3] Vite Error "Failed to resolve entry for package vuetify" when importing Sass Module

[nikolasdas]

Environment

Vuetify Version: 3.1.3
Vue Version: 3.2.47
Browsers: Google Chrome
OS: Windows

Steps to reproduce

• Create a blank project with Vite 4, Vue 3, Sass and Vuetify 3
• Add the Vuetify Sass Module with @use "vuetify"

Expected Behavior

The project should run normally

Actual Behavior

Error: Failed to resolve entry for package "vuetify". The package may have incorrect main/module/exports specified in its package.json.

Reproduction Link

https://stackblitz.com/edit/vitejs-vite-jdslxa?file=src/style.scss

[craigrileyuk]

I'm getting this one as well, also from trying to import a config SCSS file before createVuetify:

// vuetify-config.scss
@use 'vuetify' with (
  $color-pack: false,
  $utilities: false,
  $reset: false,
);

which is imported from:

import "./vuetify-config.scss";
import { aliases, mdi } from "vuetify/iconsets/mdi-svg";
import { createVuetify } from "vuetify";

export default createVuetify({
    icons: {
        defaultSet: "mdi",
        aliases,
        sets: {
            mdi,
        },
    },
});

and results in:

throw new Error(`Failed to resolve entry for package "${id}". ` +
          ^

Error: Failed to resolve entry for package "vuetify". The package may have incorrect main/module/exports specified in its package.json.

Have confirmed that the import of the SCSS file is the only thing that causes the error

EDIT: Seems to be a problem introduced with Vite 4.1.0+, I've bumped back to v4.0.4 and it works fine.

[KaelWD]

Caused by vitejs/vite#11595, vite now has no way to resolve a different sass entry without vitejs/vite#7817

[KaelWD]

I opened vitejs/vite#11947

[craigrileyuk]

Yep, further to your comment in the Vite repo @KaelWD , using:

@use 'vuetify/lib/styles/main.sass' with (
  $color-pack: false,
  $utilities: false,
  $reset: false,
);

Seems to be the way to go.

[kstraszewski]

I see that te issue is closed from last week, but I still can't use vuetify on Nuxt 3.2 or 3.3.1. Is there any way or we need to wait for vite 4.2?

@edit: getting same error on 3.1.10

[Maxim-Mazurok]

To be clear, this fixed it for me: replace in my main.scss: @use "vuetify" with ( with @use "vuetify/lib/styles/main.sass" with ( as per comments above

[KaelWD]

You can use vite 4.0 or 4.2-beta, this only exists with vite 4.1