-
-
Notifications
You must be signed in to change notification settings - Fork 8.4k
Description
Describe the bug
When using the shadcn add command with a direct registry URL (e.g., npx shadcn@latest add https://example.com), the CLI does not send an Accept: application/json header in its HTTP requests.
This prevents custom component registries from using standard HTTP Content Negotiation (such as Vercel Edge Rewrites or standard API routers) to seamlessly serve JSON data to the CLI while simultaneously serving human-readable HTML documentation to browsers at the exact same root URL. Without this header, servers often default to HTML, causing the CLI to crash with a SyntaxError: Unexpected token '<' when it attempts to parse the <!DOCTYPE html> response as JSON.
The fetch call that needs to be updated is located within the fetchRegistry function in packages/shadcn/src/registry/fetcher.ts. Because this acts as the core HTTP client for all remote registry operations (e.g., via getRegistry() and getRegistries()), the HTTP headers are globally absent.
Affected component/components
shadcn CLI (Registry Fetching - packages/shadcn/src/registry/fetcher.ts)
How to reproduce
- Host a registry endpoint that uses content negotiation (e.g., returns HTML by default, but JSON if
Accept: application/jsonis strictly requested). - Run
npx shadcn@latest add https://your-custom-registry.com/component. - The CLI will receive the default HTML response instead of JSON.
- See error:
Unexpected token '<', "<!DOCTYPE "... is not valid JSON.
Codesandbox/StackBlitz link
N/A (Issue relates to internal CLI network requests to external URLs)
Logs
$ npx shadcn@latest add https://example.com/component
✔ Checking registry.
✖ Failed to fetch remote registry at https://example.com/component.
SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSONSystem Info
Binaries:
Node: 20.x or higher
npm: 10.x
shadcn-ui: latest
Platform: Any (macOS/Linux/Windows)Proposed Solution
I am happy to submit a PR for this! The fix simply involves modifying the fetchRegistry function in packages/shadcn/src/registry/fetcher.ts to include the Accept header alongside any existing authentication headers:
headers: {
'Accept': 'application/json',
...existingHeaders
}Before submitting
- I've made research efforts and searched the documentation
- I've searched for existing issues