Ionic 3 can't use ion-* components inside my custom components

Question

I have recently upgraded to Ionic 3 from Ionic 2, and I created components.module.ts file and declared and exported each custom component I have, and then imported this single file in every page module I have.

So now the problem is that I can't use ion-* components inside my own components, because I did not imported the IonicModule.forRoot(..) inside my components.module.

The error is:

"Template parse errors: 'ion-spinner' is not a known element ..."

What am I doing wrong?

Answer 1

Alright, so I figured out the solution:

All i needed was to import IonicModule in components.module, without forRoot(..).

Also note that Angular's CommonModule is also necessary to make Angular's directives work, so you probably need to import it too.

Answer 2

Based on Eliran response, here you are an example in case somebody need something visual, in components.module.ts:

@NgModule({
 imports: [
  CommonModule, <<<< add the angular common module
  IonicModule <<<< add the ionic module
 ],
 ...
})