[Bug]: Failed to fetch styles from registry

[Epxir]

Reproduction

1

Describe the bug

ERROR  [GET] "https://www.shadcn-vue.com/registry/styles/index.json": <no response> fetch failed             23:13:12

    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async $fetchRaw2 (/C:/Users/111/AppData/Local/npm-cache/_npx/360157ef5dc9b5fb/node_modules/ofetch/dist/shared/ofetch.37386b05.mjs:231:14)
    at async $fetch2 (/C:/Users/111/AppData/Local/npm-cache/_npx/360157ef5dc9b5fb/node_modules/ofetch/dist/shared/ofetch.37386b05.mjs:268:15)
    at async /C:/Users/111/AppData/Local/npm-cache/_npx/360157ef5dc9b5fb/node_modules/shadcn-vue/dist/index.js:443:26
    at async Promise.all (index 0)
    at async fetchRegistry (/C:/Users/111/AppData/Local/npm-cache/_npx/360157ef5dc9b5fb/node_modules/shadcn-vue/dist/index.js:441:21)
    at async getRegistryStyles (/C:/Users/111/AppData/Local/npm-cache/_npx/360157ef5dc9b5fb/node_modules/shadcn-vue/dist/index.js:363:22)
    at async promptForConfig (/C:/Users/111/AppData/Local/npm-cache/_npx/360157ef5dc9b5fb/node_modules/shadcn-vue/dist/index.js:998:18)
    at async Command.<anonymous> (/C:/Users/111/AppData/Local/npm-cache/_npx/360157ef5dc9b5fb/node_modules/shadcn-vue/dist/index.js:985:20)
  
  
   ERROR  Failed to fetch styles from registry.

I found shadcn-ui/ui#1371 it doesnt solve the problem,is it due to differences in projects?

System Info

window

Contributes

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

[sadeghbarati]

@Epxir Can you share your System Info? node version etc..

[Epxir]

@Epxir Can you share your System Info? node version etc..

node v20.11.0,npm 10.2.4,
use the command npx shadcn-vue@latest init，I think it's a network problem,but setting the proxy does not solve the problem,i can open https://www.shadcn-vue.com/registry/styles/index.json,it is [{"name":"default","label":"Default"},{"name":"new-york","label":"New York"}]

[Epxir]

Only proxy is not available. You can use vpn and other modes, such as tun mode of clash. hope it will be useful.

[one0oneChen]

Only proxy is not available. You can use vpn and other modes, such as tun mode of clash. hope it will be useful.

I had the same problem, vpn can access the Internet but can not execute the npx shadcn-vue@latest init command, Even setting the environment variable with New-Item-Path 'Env:' -Name 'HTTP_PROXY' -Value 'https://www.shadcn-vue.com' and
use VPN TUN mode will not work.
Since the init command is not available, how do I install it manually?

[sadeghbarati]

Try

npm install -g shadcn-vue@latest

Then, use it without npx like

shadcn-vue init/add

See if it's works

[larserikfinholt]

I'm having the same problem, installing the tool globally and running without npx does not fix the problem

node -v v20.11.0
npm -v 10.5.0

tried setting proxy, http-proxy, and https-proxy, and also pass this as arguments without any luck

[MrSunshyne]

I've encountered the same issue while trying to install the resizable component

pnpx shadcn-vue@latest add resizable

 ERROR  [GET] "https://www.shadcn-vue.com/registry/colors/blue.json": 404 Not Found                                                               4:33:03 PM

  at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
  at async $fetch2 (/Users/NuxtIsAwesome/Library/pnpm/global/5/.pnpm/[email protected]/node_modules/ofetch/dist/shared/ofetch.00501375.mjs:261:15)
  at async /Users/NuxtIsAwesome/Library/pnpm/global/5/.pnpm/[email protected][email protected]/node_modules/shadcn-vue/dist/index.js:443:26
  at async Promise.all (index 0)
  at async fetchRegistry (/Users/NuxtIsAwesome/Library/pnpm/global/5/.pnpm/[email protected][email protected]/node_modules/shadcn-vue/dist/index.js:441:21)
  at async getRegistryBaseColor (/Users/NuxtIsAwesome/Library/pnpm/global/5/.pnpm/[email protected][email protected]/node_modules/shadcn-vue/dist/index.js:395:22)
  at async Command.<anonymous> (/Users/NuxtIsAwesome/Library/pnpm/global/5/.pnpm/[email protected][email protected]/node_modules/shadcn-vue/dist/index.js:509:23)


 ERROR  Failed to fetch base color from registry.                                                                                                 4:33:03 PM

I noticed the url is actually a 404. If you visit “https://www.shadcn-vue.com/registry/colors/blue.json”. Which is what the tool is trying to access. So it makes sense it fails.

After reading the previous comments, I also tried installing shadcn-vue globally and using that, but it's still the same error.

Happy to provide any other info that might help with debugging.

[zernonia]

@MrSunshyne can you check your components.json's tailwind.baseColor. We don't support blue as base color, but only slate, gray, zinc, neutral and stone. Please try updating that value and install the component again 😁

[MrSunshyne]

@zernonia you're correct !

{
  "$schema": "https://shadcn-vue.com/schema.json",
  "style": "default",
  "typescript": true,
  "tailwind": {
    "config": "tailwind.config.js",
    "css": "assets/css/tailwind.css",
-    "baseColor": "blue",
    "cssVariables": true
  },
  "framework": "nuxt",
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils"
  }
}

I can see 'blue' in components.json.
It was there since i spawned the project. Thank you !

[larserikfinholt]

Do we have any workaround for this proxy issue? It would be really nice to use npx to add and update components...

@Epxir I would assume this is only related to people working behind a proxy, so maybe include that in the title?

[Epxir]

Many countries and regions may have special network environments. The website read inside the npx running script may not be affected by the proxy. You need to make the global network take over by the proxy program. Environment variables will not work.
@larserikfinholt

[larserikfinholt]

@Epxir not sure if I understand. As I see it it is the npx script reading the json file that does not use the proxy configured by environmentvariables or passed into it. Could it be possible to modify the npx script to accept a proxy setting?

[Epxir]

Modifying the script is not an easy way,use a VPN or other global proxy tool to hijack all network connections.

[sadeghbarati]

Website or registry files are on Cloudflare pages there are a lot of reasons that might happen like bad caching or other errors on server which I'm not aware of

Using DNS or VPN might help resolve this issue

[Zaiyiiiiii]

it's a bad design as a package to fetch something from 3rd party site.

[Summpot]

It seems to be the ofetch that causes the problem, its doesn't care much about environment variables such as http_proxy, nuxi also has a similar problem using ofetch, in my environment (linux or wsl2 on windows) I can use proxychains as a workaround.
After installing proxychains add something similar to the following to the end of the /etc/proxychains4.conf file.

[ProxyList]
http    127.0.0.1 10808