Missing "./dist/vue-select.css" export in "vue-select" package

[matthewknill]

Please respect maintainers time by filling in these sections. Your issue will likely be closed without this information.

• Vue Version: 3.2.33
• Vue Select Version: 4.0.0-beta.3
• Vite: 2.9.12

Describe the bug
Currently, using Vite and when I run npm run dev after running npm update, I get the following error:

✘ [ERROR] [plugin vite:dep-scan] Missing "./dist/vue-select.css" export in "vue-select" package

    node_modules/vite/dist/node/chunks/dep-689425f3.js:38597:7:
      38597 │   throw new Error(
            ╵         ^

    at bail (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:38597:8)
    at resolve (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:38674:10)
    at resolveExports (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:40982:12)
    at resolveDeepImport (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:41000:31)
    at tryNodeResolve (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:40773:20)
    at Context.resolveId (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:40581:28)
    at Object.resolveId (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:39254:55)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async resolve (/var/www/html/node_modules/vite/dist/node/chunks/dep-689425f3.js:39466:26)

It also seems to happen when running npm run build

Expected behaviour
It was working fine a while ago and I actually checked that the vue-select.css file exists in the vue-select package and it does. Any help on why this error is occurring would be much appreciated.

[enomoto-kudamono]

Facing same issue in 4.0.0-beta.4 as "./dist/vue-select.css" is not be exported in package.json

[matthewknill]

Facing same issue in 4.0.0-beta.4 as "./dist/vue-select.css" is not be exported in package.json

Yep, I've also tried with 4.0.0-beta.4 and it comes up with the same issue.

[osmancandulger]

Same issue for "vue": "^3.2.37" and "vue-select": "^4.0.0-beta.3"

[jkojoa]

Same issue with missing export for "./dist/vue-select.css" "vue": "^3.2.37" and "vue-select": "^4.0.0-beta.3"

[bci24]

same error with "vue: 3.2.37" and "[email protected]

[bci24]

i have downgraded from [email protected] to [email protected] and now I can build...

[sagalbot]

Fixed and released in 4.0.0-beta.5. Thanks for reporting!

[justice47]

Issue still persist for me at the latest beta
Error: Missing "./src/scss/vue-select.scss" export in "vue-select" package
Is it the same issue?

UPD:
My fault, I haven't changed scss import in the vue component from the previous vue-select version in the scope of transition to Vue 3

[bci24]

Is this the same issue or a new bug ?

I have upgraded from beta 3 to beta 5 an I am having this error when compiling:

In the app.scss I have imported the css file:

@import "~vue-select/dist/vue-select.css"

[ankurk91]

I still have this issue.

Using webpack and sass-loader, and vue-select 4.0.0-beta.5

// vendor.scss
@import '~vue-select/dist/vue-select.css';

Compiled with problems:

ERROR in ./resources/sass/admin/vendor.scss (./resources/sass/admin/vendor.scss.webpack[javascript/auto]!=!./node_modules/.pnpm/[email protected][email protected]/node_modules/css-loader/dist/cjs.js??clonedRuleSet-3.use[1]!./node_modules/.pnpm/[email protected]_m6qh27jiicejwnzfgs742cokpe/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-3.use[2]!./node_modules/.pnpm/[email protected]_vj7luxzvcsn763rnf72h6efq4y/node_modules/sass-loader/dist/cjs.js??clonedRuleSet-3.use[3]!./resources/sass/admin/vendor.scss)

Module build failed (from ./node_modules/.pnpm/[email protected][email protected]/node_modules/css-loader/dist/cjs.js):
Error: Can't resolve '~vue-select/dist/vue-select.css' in '/home/ankurk/projects/laravel-app/resources/sass/admin'
    at finishWithoutResolve (/home/ankurk/projects/laravel-app/node_modules/.pnpm/[email protected]/node_modules/enhanced-resolve/lib/Resolver.js:309:18)

When I removed the "exports" section from node_modules/vue-select/package.json and it worked.

[MaxKorlaar]

We're getting an error when including the stylesheet from an SCSS file using sass-loader. This is because the exports field in package.json only includes values for import and require, but not for style, which is used when referencing imports from stylesheets.

The solution for this would be to add a style key to the exports item, like so:

"./dist/vue-select.css": {
        "import": "./dist/vue-select.css",
        "style": "./dist/vue-select.css",
        "require": "./dist/vue-select.css"
}

[ankurk91]

@MaxKorlaar can you send a PR?

[MaxKorlaar]

Sure @ankurk91, I'll get back on this tomorrow