@NgModule.declarations aren't inherited by child modules. If you need pipes, directives, components from a module, the module should be imported into your feature module.

The module with all the core pipes is CommonModule from @angular/common

import { CommonModule } from '@angular/common';

@NgModule({
  imports: [ CommonModule ]
})
class BlogModule {}

The reason it works in the app.component is because you are most likely importing BrowserModule into the AppModule. BrowserModule re-exports CommonModule, so by importing BrowserModule, it's like also importing CommonModule.

It's also worth noting that CommonModule has the core directives also, like ngFor and ngIf. So if you have a feature module that uses those, you will also need to import the CommonModule into that module.


If the component at the route you're loading is not declared (via declarations:[]) then you will also get this type of error.


When adding a new component in Angular 9 I had to restart the development server possibly also because of HMR:

ng serve --hmr

Without this the application simply did not load all the dependencies and issued this error.


If you tried all above mentioned answers but it is not working means , Just do npm run start it will work , In my case after some compilation issue this error came.