懶載入實現步驟：

1.增(module.ts)，2.編(ts檔案裡增加@IonicPage())，3刪(移除import引用，然後改成引號)。

建立一個新的ionic工程(ionic start app tabs)

專案目錄如下：

1.在需要懶載入的頁面建立一個新檔案：名字.module.ts。如圖所示

在每個module.ts內容都是一樣的，例如about頁面

home.module.ts 【和about是不是都一樣，其他也是這樣的】

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { HomePage } from './home';
@NgModule({
    declarations: [
        HomePage,
    ],
    imports: [
        IonicPageModule.forChild(HomePage),
    ],
})
export class HomePageModule { }
 

2. module檔案配置完成之後，需要在懶載入檔案的.ts檔案配置@IonicPage

以home.ts為例子

about.ts

import { Component } from '@angular/core';
import { NavController,IonicPage } from 'ionic-angular';
@IonicPage()
@Component({
  selector: 'page-about',
  templateUrl: 'about.html'
})
export class AboutPage {
  constructor(public navCtrl: NavController) {
  }
}
 

3. 基本上已經配置完成了，剩下的就是刪除在app.module.ts的引用

如果想使用懶載入，只需要將之前的頁面名字用引號引起來即可，對應的也不需要在頂部進行import匯入

【切記，懶載入不需要import，用引號！！！】

以tabs.ts為例子

當然也不用忘記我們在app.component中的跟路由懶載入

此時ionic的懶載入就實現了~~，執行一下看看效果吧~。