sagalbot / vue-select

Everything you wish the HTML <select> element could do, wrapped up into a lightweight, extensible Vue component.
https://vue-select.org
MIT License
4.62k stars 1.33k forks source link

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

Closed matthewknill closed 1 year ago

matthewknill commented 1 year ago

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

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 commented 1 year ago

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

matthewknill commented 1 year ago

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 commented 1 year ago

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

jkojoa commented 1 year ago

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

bci24 commented 1 year ago

same error with "vue: 3.2.37" and "vue-select@4.0.0-beta.4

bci24 commented 1 year ago

i have downgraded from vue-select@4.0.0-beta.4 to vue-select@4.0.0-beta.3 and now I can build...

sagalbot commented 1 year ago

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

justice47 commented 1 year ago

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 commented 1 year ago

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:

vue_select_4 beta5_bug

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

@import "~vue-select/dist/vue-select.css"
ankurk91 commented 1 year ago

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/css-loader@6.7.1_webpack@5.74.0/node_modules/css-loader/dist/cjs.js??clonedRuleSet-3.use[1]!./node_modules/.pnpm/postcss-loader@7.0.1_m6qh27jiicejwnzfgs742cokpe/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-3.use[2]!./node_modules/.pnpm/sass-loader@13.0.2_vj7luxzvcsn763rnf72h6efq4y/node_modules/sass-loader/dist/cjs.js??clonedRuleSet-3.use[3]!./resources/sass/admin/vendor.scss)

Module build failed (from ./node_modules/.pnpm/css-loader@6.7.1_webpack@5.74.0/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/enhanced-resolve@5.10.0/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 commented 1 year ago

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 commented 1 year ago

@MaxKorlaar can you send a PR?

MaxKorlaar commented 1 year ago

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