Cannot read property 'source' of undefined when importing a missing Svelte component

Question

Compiler Error Context
During Svelte compilation, attempting to import a component that either does not exist or cannot be parsed results in the JavaScript exception Cannot read property 'source' of undefined. This occurs when the compiler generates an abstract syntax tree (AST) node that is null, yet the compilation pipeline expects a valid node.
Unresolved Diagnostic Decision
The Svelte documentation currently offers no specific guidance for this scenario. The generic error obscures whether the root cause is a missing file, an incorrect path, or a syntax error within the target component. An open design question is whether the compiler should emit a more descriptive diagnostic such as “Failed to resolve component 'Foo'” or “Syntax error in component 'Bar'” to aid developers.
Key Trade‑offs
Providing richer diagnostics would improve developer experience but may introduce additional compilation overhead. Detecting the precise failure mode (missing import vs syntax error) without significant performance impact remains uncertain.
Questions for Discussion

Should the Svelte compiler emit distinct error messages for missing imports versus syntax errors in imported components?
What is the minimal change required to the compiler’s AST handling to support such fine‑grained diagnostics?
How can the compiler balance improved error specificity against the risk of increased compile times?

Tasadduq Burney · Answer

Why the error appears
During compilation the Svelte compiler builds an AST for each imported component. If the import cannot be resolved or the file contains a syntax error, the compiler may produce a null AST node. Later code tries to read the source property of that node, resulting in the exception Cannot read property 'source' of undefined.
Confirmed facts

The error is thrown by the compiler, not at runtime.
It can be caused by a missing file, an incorrect path (including case‑sensitivity), a wrong file extension, or a syntax error inside the target component.
The message does not distinguish between these cases.
Clearing the compiler cache removes stale build artifacts that might mask the real problem.

Steps to resolve

Verify the import statement matches an actual file on disk, respecting case and using the .svelte extension.
If the file exists, open it and run svelte-check (or start the dev server) to see if any syntax errors are reported.
Fix any syntax errors, then recompile.
If the file is missing, either create it with the expected name or correct the import path.
After changes, clear the Svelte compiler cache: delete .svelte-kit for SvelteKit projects or dist/.svelte for plain Svelte, then rebuild.

Missing diagnostic detail
Are you using SvelteKit or a plain Svelte project? The location of the compiler cache differs between the two, which affects the exact command to clear it.

Cannot read property 'source' of undefined when importing a missing Svelte component

Compiler Error Context

Unresolved Diagnostic Decision

Key Trade‑offs

Questions for Discussion

1 answer

Why the error appears

Confirmed facts

Steps to resolve

Missing diagnostic detail

Your perspective belongs here.

0 question comments