Clarification on Ionic /components folder

Ionic Framework ionic-v3
62

ionic g component DeviceFieldComponent

Generates:

device-field.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { DeviceFieldComponent } from './device-field';

@NgModule({
  declarations: [
    DeviceFieldComponent,
  ],
  imports: [
    IonicPageModule.forChild(DeviceFieldComponent),
  ],
  exports: [
    DeviceFieldComponent
  ]
})
export class DeviceFieldComponentModule {}

Then, is this a bug, and it should be

  imports: [
    IonicModule,
  ],

?

63

No, it is not a bug. IonicModule and IonicPageModule are totally unrelated and not interchangeable. IonicPageModule sets up the entry in the module loader table that enables the navigation system to be able to navigate using strings. IonicModule must be imported in any submodule containing components that incorporate Ionic components in their templates. Similarly, CommonModule must be imported if you are using things like ngFor.

64

Then,

  1. If we want to create a component, (letā€™s imagine, just a custom canvas with some functions), we should use IonicModule?

  2. When should we use, in a component, IonicPageModule? (Just in pages, I suposse?)

Thanks,

65

Only if it incorporates any <ion-*> elements.

Never.

Right.

66

Ok.

Then, ionic team should change the generated code for the command:


ionic g component myComponent

Because it generates the wrong code with this Import (IonicPageModule.)

Because if you want to generate a page, you have

ionic g page MyPage

Isnā€™t it?

1 Like
67

I donā€™t use the generators; I donā€™t see net value in the concept.

68

Iā€™ll raise a bug. Just for people that use them :).

Thanks for the explanations :slight_smile:

69

Pls how did you solve this Ionic 3/Component issue, am having the same problem after using ionic g component componentname. I have read through this tread, pls i need a straight forward response from you. plsss