How to import a child component correctly into an lazy loaded IonicPage?

I have this problem where my child component throws "is not a known element:" error.

this is my module component Bubble-list.module

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { BubbleListComponent } from './bubble-list.component';

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

bubble-list.component

import { Component } from '@angular/core';

@Component({
  selector: 'bubble-list',
  templateUrl: 'bubble-list.html'
})
export class BubbleListComponent {

  text: string;

  constructor() {
    this.text = 'Hello Hello BubbleListComponent Component ';
    console.log(this.text);
  }

}

my Parent Module

import { BubbleListComponent } from './components/bubble-list/bubble-list.component';
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { MyMainPage } from './my-editor';

@NgModule({
    declarations: [
        MyMainPage
    ],
    imports: [
        IonicPageModule.forChild(MyMainPage),
        BubbleListComponent
    ],
    exports: [
        MyMainPage
    ],
    providers: [

    ]
})
export class MyMainPageModule { }

And in my HTML

<div
    <bubble-list></bubble-list>
</div>

If I declare them in app.module's @NgModule() declarations it works but I want to keep all the child components inside my Parent component. because they are not needed in other places. I am missing something?

The error is:

'bubble-list' is not a known element:
1. If 'bubble-list' is an Angular component, then verify that it is part of this module.
2. If 'bubble-list' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas

Thanks in advance.

Edit:

Here the complete Error:

polyfills.js:3 Unhandled Promise rejection: Template parse errors:
'bubble-list' is not a known element:
1. If 'bubble-list' is an Angular component, then verify that it is part of this module.
2. If 'bubble-list' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. (""><br><br><br><br>newItem: {{annotationsProvider.bubbleInEdition.isNewItem}}<br><br><br></div>

    [ERROR ->]<bubble-list></bubble-list>
</ion-menu>

"): ng:///AppModule/myParentPage.html@14:4 ; Zone: <root> ; Task: Promise.then ; Value: Error: Template parse errors:
'bubble-list' is not a known element:
1. If 'bubble-list' is an Angular component, then verify that it is part of this module.
2. If 'bubble-list' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. (""><br><br><br><br>newItem: {{annotationsProvider.bubbleInEdition.isNewItem}}<br><br><br></div>

    [ERROR ->]<bubble-list></bubble-list>
</ion-menu>

"): ng:///AppModule/myParentPage.html@14:4
    at syntaxError (http://localhost:8100/build/main.js:91164:34)
    at TemplateParser.parse (http://localhost:8100/build/main.js:101655:19)
    at JitCompiler._compileTemplate (http://localhost:8100/build/main.js:115406:39)
    at http://localhost:8100/build/main.js:115330:62
    at Set.forEach (native)
    at JitCompiler._compileComponents (http://localhost:8100/build/main.js:115330:19)
    at createResult (http://localhost:8100/build/main.js:115215:19)
    at t.invoke (http://localhost:8100/build/polyfills.js:3:8971)
    at r.run (http://localhost:8100/build/polyfills.js:3:4140)
    at http://localhost:8100/build/polyfills.js:3:13731 Error: Template parse errors:
'bubble-list' is not a known element:
1. If 'bubble-list' is an Angular component, then verify that it is part of this module.
2. If 'bubble-list' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. (""><br><br><br><br>newItem: {{annotationsProvider.bubbleInEdition.isNewItem}}<br><br><br></div>

    [ERROR ->]<bubble-list></bubble-list>
</ion-menu>

"): ng:///AppModule/myParentPage.html@14:4
    at syntaxError (http://localhost:8100/build/main.js:91164:34)
    at TemplateParser.parse (http://localhost:8100/build/main.js:101655:19)
    at JitCompiler._compileTemplate (http://localhost:8100/build/main.js:115406:39)
    at http://localhost:8100/build/main.js:115330:62
    at Set.forEach (native)
    at JitCompiler._compileComponents (http://localhost:8100/build/main.js:115330:19)
    at createResult (http://localhost:8100/build/main.js:115215:19)
    at t.invoke (http://localhost:8100/build/polyfills.js:3:8971)
    at r.run (http://localhost:8100/build/polyfills.js:3:4140)
    at http://localhost:8100/build/polyfills.js:3:13731

Data structure

/src
   /pages
      /my-parent-page
            myparent.module   && myparent.component
          /components
              /bubble-editor/
                  bubble.module  && bubble.component