Angular "NG8001: is not a known element" template error in CI
Angular's AOT template compiler reports NG8001 when a template uses a custom element tag that is not a known component in the current compilation context. The build fails because the element cannot be resolved.
What this error means
ng build fails with "error NG8001: 'app-widget' is not a known element" and a hint to add it to a module or imports, even when ng serve once tolerated it.
Error: src/app/home.component.html:3:1 - error NG8001: 'app-widget' is not a known element:
1. If 'app-widget' is an Angular component, then verify that it is part of this module.
2. If 'app-widget' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' ...Common causes
The component is not imported or declared
A standalone component is missing from the host component's imports, or a module-based component is not declared/exported in a shared module.
A real web component lacks the schema
A genuine custom element is used without CUSTOM_ELEMENTS_SCHEMA, so Angular treats the unknown tag as an error.
How to fix it
Import or declare the component
- Identify the tag and the component it should map to.
- Add the component to the standalone
imports, or declare/export it in its module. - Re-run the build.
@Component({
selector: 'app-home',
standalone: true,
imports: [WidgetComponent],
})Add the schema for true web components
Only for genuine custom elements, add CUSTOM_ELEMENTS_SCHEMA to the component or module.
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
@Component({ schemas: [CUSTOM_ELEMENTS_SCHEMA] })How to prevent it
- Import standalone components everywhere their selector is used.
- Export shared components from the module that declares them.
- Run
ng build(AOT) in CI so NG8001 is caught before merge.