Ionic 3 refer a new page in app module issue

Question

I generated a new page in ionic 3 using the generate command. When I try adding it to the app module it throws the following error,

Uncaught Error: Unexpecte         


        

Answer 1

In ionic 3. Each page is by default setup as a separate module in order to implement lazy loading of pages.

Your page will be declared in new-todo.module.ts.

@NgModule({
    declarations: [
        NewTodo
    ],
    imports: [
        IonicPageModule.forChild(NewTodo)
    ],
    entryComponents: [
        NewTodo
    ]
})

Check out IonicPageModule docs as well as IonicPage.

In your component new-todo.ts page, add the @IonicPage() decorator above the component decorator.

@IonicPage()
@Component({
  selector: 'page-new-todo',
  templateUrl: 'new-todo.html',
})

Also remove all imports to this page outside of the page module. Use the string 'NewTodo' instead of the imported class when pushing the page in NavController. You dont have to declare the page in app.module.ts

Answer 2

$ ionic generate creates a module for lazy-loading pages in ionic3

If you don’t want to take advantage of lazy loading use

$ ionic generate [type] [name] --no-module  

// Do not generate an NgModule for the component

https://ionicframework.com/docs/cli/generate/

Answer 3

In the declaration section of NgModule you have listed a class 'NewTodo' which requires to be A component, or directive, or pipe. Either remove the class name or add corresponding declarator @Pipe/@Directive/@Component