shadcn-ui/ui · error · Error
Failed to load ${config.tsx ? "tsconfig" : "jsconfig"}.json.
Error message
Failed to load ${config.tsx ? "tsconfig" : "jsconfig"}.json. ${tsConfig.message ?? ""} What it means
Thrown by resolveConfigPaths when the tsconfig/jsconfig loader (loadConfig from tsconfig-paths) reports resultType === "failed". shadcn needs the TS/JS config to resolve path aliases, so a failed load aborts config resolution. The message includes the loader's own message when present.
Source
Thrown at packages/shadcn/src/utils/get-config.ts:61
return await resolveConfigPaths(cwd, config)
}
export async function resolveConfigPaths(
cwd: string,
config: z.infer<typeof rawConfigSchema>
) {
// Merge built-in registries with user registries
config.registries = {
...BUILTIN_REGISTRIES,
...(config.registries || {}),
}
// Read tsconfig.json.
const tsConfig = await loadConfig(cwd)
if (tsConfig.resultType === "failed") {
throw new Error(
`Failed to load ${config.tsx ? "tsconfig" : "jsconfig"}.json. ${
tsConfig.message ?? ""
}`.trim()
)
}
// Resolve the primary aliases first so fallbacks can reuse their results.
const resolvedUtils = await resolveAliasPath(
"utils",
config.aliases["utils"],
cwd,
tsConfig
)
const resolvedComponents = await resolveAliasPath(
"components",
config.aliases["components"],
cwd,
tsConfigView on GitHub (pinned to efac598707)
Solutions
- Ensure a valid tsconfig.json (or jsconfig.json for JS projects) exists at the cwd shown in the message.
- Open the config and fix any JSON syntax errors; validate with `npx tsc --noEmit` or a JSON linter.
- Check every "extends" target resolves (install missing packages or correct the path).
- Re-run `npx shadcn@latest init` if the project config is unrecoverable.
Example fix
// tsconfig.json (before) — trailing comma / broken JSON
{
"compilerOptions": { "paths": { "@/*": ["./src/*"] } },
}
// after
{
"compilerOptions": { "paths": { "@/*": ["./src/*"] } }
} Defensive patterns
Strategy: validation
Validate before calling
import { loadConfig } from "tsconfig-paths"
const tsConfig = await loadConfig(cwd)
if (tsConfig.resultType === "failed") {
throw new Error(`tsconfig load failed: ${tsConfig.message ?? "unknown"}`)
} Type guard
const isTsConfigOk = (c: any) => c.resultType === "success"
Try / catch
try {
await getConfig(cwd)
} catch (e) {
if (e instanceof Error && /Failed to load (ts|js)config/.test(e.message)) {
// guide user to fix tsconfig.json
}
throw e
} Prevention
- Always commit a valid tsconfig.json/jsconfig.json at the project root.
- Validate tsconfig with `npx tsc --noEmit` before running shadcn.
- Ensure every "extends" target is installed.
- Run shadcn from the directory containing the tsconfig.
When it happens
Trigger: During getConfig/resolveConfigPaths, loadConfig(cwd) returns { resultType: 'failed', message }. This happens when tsconfig.json (or jsconfig.json when config.tsx is false) is missing, unreadable, malformed JSON, or references extends paths that cannot be resolved.
Common situations: Running shadcn in a directory without a tsconfig.json; tsconfig.json with a syntax/JSON error; an "extends" pointing at a non-existent package; corrupt jsconfig.json in a non-TSX project; running from the wrong directory.
Related errors
- Could not resolve the following aliases in ${highlighter.inf
- No `components.json` file found. Ensure you are at the root
- No components.json found. Run shadcn init first.
- INVALID_CONFIG
- NOT_CONFIGURED
AI-assisted analysis of shadcn-ui/ui@efac598707 (2026-08-12).
Data as JSON: /api/errors/346db42015b0852c.
Report an issue: GitHub.