[Bug]: npx shadcn-vue@latest Get npm ERR! Invalid Version:

insuber commented 1 month ago

Reproduction

Describe the bug

I'm experiencing an issue while trying to follow the installation tutorial provided at https://www.shadcn-vue.com/docs/installation/nuxt.html. After completing all the steps correctly, I encountered an error when executing the command: npx shadcn-vue@latest init Here's the error message I received:

npx shadcn-vue@latest init
Need to install the following packages:
shadcn-vue@0.10.4
Ok to proceed? (y) y
npm ERR! Invalid Version:

This error persists even though I have already installed the shadcn-vue@0.10.4 package both globally and as a local project dependency.

The specific version shadcn-vue@0.10.4 works fine npx shadcn-vue@0.10.4 init

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (8) x64 Intel(R) Core(TM) i7-4790 CPU @ 3.60GHz
    Memory: 8.36 GB / 15.84 GB
  Binaries:
    Node: 20.9.0 - D:\nodejs\node.EXE
    Yarn: 1.22.21 - D:\nodejs\yarn.CMD
    npm: 10.1.0 - D:\nodejs\npm.CMD
    pnpm: 9.1.0 - D:\nodejs\pnpm.CMD
    Watchman: 20231008.002904.0 - C:\Users\insub\scoop\shims\watchman.EXE
  Browsers:
    Chrome: 125.0.6422.60
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.19041.4355
  npmPackages:
    nuxt: ^3.11.2 => 3.11.2
    shadcn-nuxt: ^0.10.4 => 0.10.4
    shadcn-vue: 0.10.4 => 0.10.4
    vue: ^3.4.27 => 3.4.27

Contributes

[ ] I am willing to submit a PR to fix this issue
[ ] I am willing to submit a PR with failing tests

sadeghbarati commented 1 month ago

Maybe it's related to your npm cache or global binaries Can you use this command for listing installed global binaries

npm list -g

If the list has shadcn-vue remove it with

npm remove -g shadcn-vue

insuber commented 1 month ago

npm list -g
D:\nodejs -> .\
+-- corepack@0.20.0
+-- npm@10.1.0
+-- pnpm@9.1.0
+-- react-native-cli@2.0.1
`-- yarn@1.22.21

And pnpm list -g get:

pnpm list -g
Legend: production dependency, optional only, dev only

C:\Users\xxx\AppData\Local\pnpm\global\5

dependencies:
@shopify/cli 3.60.1

npx shadcn-vue@latest add still not work:

npx shadcn-vue@latest add input
Need to install the following packages:
shadcn-vue@0.10.5
Ok to proceed? (y) npm ERR! canceled

npm ERR! A complete log of this run can be found in: C:\Users\xxx\AppData\Local\npm-cache\_logs\2024-05-21T10_06_04_324Z-debug-0.log

2024-05-21T10_06_04_324Z-debug-0.log:

183 timing idealTree Completed in 9481ms
184 timing command:exec Completed in 24004ms
185 verbose stack TypeError: Invalid Version: 
185 verbose stack     at new SemVer (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\semver\classes\semver.js:38:13)
185 verbose stack     at compare (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\semver\functions\compare.js:3:32)
185 verbose stack     at Object.gte (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\semver\functions\gte.js:2:30)
185 verbose stack     at Node.canDedupe (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\@npmcli\arborist\lib\node.js:1079:32)
185 verbose stack     at PlaceDep.pruneDedupable (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\@npmcli\arborist\lib\place-dep.js:426:14)
185 verbose stack     at new PlaceDep (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\@npmcli\arborist\lib\place-dep.js:278:14)
185 verbose stack     at #buildDepStep (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\@npmcli\arborist\lib\arborist\build-ideal-tree.js:933:18)
185 verbose stack     at async Arborist.buildIdealTree (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\@npmcli\arborist\lib\arborist\build-ideal-tree.js:196:7)
185 verbose stack     at async Promise.all (index 1)
185 verbose stack     at async Arborist.reify (C:\Users\xxx\AppData\Roaming\nvm\v20.9.0\node_modules\npm\node_modules\@npmcli\arborist\lib\arborist\reify.js:159:5)
186 verbose cwd D:\Sites\shopify\nuxt-app
187 verbose Windows_NT 10.0.19045
188 verbose node v20.9.0
189 verbose npm  v10.1.0
190 error Invalid Version: 
191 verbose exit 1
192 timing npm Completed in 25110ms
193 verbose unfinished npm timer reify 1716286030939
194 verbose unfinished npm timer reify:loadTrees 1716286030940
195 verbose unfinished npm timer idealTree:buildDeps 1716286031044
196 verbose unfinished npm timer idealTree:node_modules/c12 1716286038280
197 verbose code 1
198 error A complete log of this run can be found in: C:\Users\xxx\AppData\Local\npm-cache\_logs\2024-05-21T10_06_55_312Z-debug-0.log

npx shadcn-vue@0.10.4 add input work fine.

npx shadcn-vue@0.10.4 add input
√ Component input already exists. Would you like to overwrite? ... yes
√ Done.

@sadeghbarati

insuber commented 1 month ago

I've noticed that the pnpx shadcn-vue@latest add input command is working well now. But the generated components were not placed under the project root directory, such as: D:\Sites\project\nuxt-app\components\ui\badge Instead, they were generated outside the project directory: D:\Sites\project\components\ui\badge

I executed the command in the directory: D:\Sites\project\nuxt-app pnpx shadcn-vue@latest add badge

sadeghbarati commented 1 month ago

That is weird working with pnpm dlx or pnpx but not with npx :'(

can you purge your npm-cache folder/directory?

sadeghbarati commented 1 month ago

If you are in Nuxt/JS project check this issue

https://github.com/radix-vue/shadcn-vue/issues/291

radix-vue / shadcn-vue