search

shadcn-ui / ui

Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
https://ui.shadcn.com
MIT License
73.92k stars 4.55k forks source link

Error when installing ShadCN using CLI (reopened from #2280 ) #4822

Open Ronit-gurjar opened 1 month ago

Ronit-gurjar commented 1 month ago 
         @Ronit-gurjar let's open a new thread since we have a new cli. thank you.

Originally posted by @shadcn in https://github.com/shadcn-ui/ui/issues/2280#issuecomment-2346377347

Ronit-gurjar commented 1 month ago

ISSUE:

When installing Shadcn using npx shadcn-ui@latest init or npx shadcn-ui init , the following error is generated:

Need to install the following packages: shadcn-ui Ok to proceed? (y) y node:fs:581 return binding.open( ^ Error: package.json: ENOENT: no such file or directory, open 'D:\projects\lawyer-appointment\package.json' at Object.openSync (node:fs:581:18) at Object.readFileSync (node:fs:457:35) at Object.readFileSync (C:\Users\hp\AppData\Local\npm-cache_npx\74755fd285ad77f7\node_modules\jsonfile\index.js:50:22) at Ae (file:///C:/Users/hp/AppData/Local/npm-cache/_npx/74755fd285ad77f7/node_modules/shadcn-ui/dist/index.js:245:4075) at zt (file:///C:/Users/hp/AppData/Local/npm-cache/_npx/74755fd285ad77f7/node_modules/shadcn-ui/dist/index.js:245:4206) at file:///C:/Users/hp/AppData/Local/npm-cache/_npx/74755fd285ad77f7/node_modules/shadcn-ui/dist/index.js:245:4433 at ModuleJob.run (node:internal/modules/esm/module_job:218:25) at async ModuleLoader.import (node:internal/modules/esm/loader:329:24) at async loadESM (node:internal/process/esm_loader:34:7) at async handleMainPromise (node:internal/modules/run_main:113:12) { errno: -4058, code: 'ENOENT', syscall: 'open', path: 'D:\projects\lawyer-appointment\package.json' }

Node.js v20.10.0

And when trying to install any shadcn component from the cli like npx shadcn@latest add textarea , getting the following error:

node:internal/modules/run_main:129 triggerUncaughtException( ^ Error: Cannot find package 'C:\Users\hplap\AppData\Local\npm-cache_npx\d66c5096c7023bfb\node_modules\ora\node_modules\chalk\index.js' imported from C:\Users\hplap\AppData\Local\npm-cache_npx\d66c5096c7023bfb\node_modules\ora\index.js Did you mean to import "chalk/index.js"? at legacyMainResolve (node:internal/modules/esm/resolve:215:26) at packageResolve (node:internal/modules/esm/resolve:841:14) at moduleResolve (node:internal/modules/esm/resolve:927:18) at defaultResolve (node:internal/modules/esm/resolve:1169:11) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:540:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:509:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:239:38) at ModuleWrap. (node:internal/modules/esm/module_job:96:40) at link (node:internal/modules/esm/module_job:95:36) { code: 'ERR_MODULE_NOT_FOUND' }

Node.js v20.10.0

WORK-AROUND/SOLUTION:

[!CAUTION] I would recommend finding better solution but if you just want to get it to work anyways you can try one of the below method:

1. Installing Components Manually from Shadcn Docs

Use Shadcn docs and when installing component, instead of "CLI" use "Manual" and follow instructions: Screenshot_20240912_210222

2. Delete Package-lock.json and try again

use this command rm -rf package-lock.json and do npm install again. Then try to install the component using cli (worked for me)