1. 更新到ionic3
.1 把node_modules/文件夹中的所有依赖删掉
.2 修改package.json,如下：
"dependencies": { "@angular/common": "4.0.0", "@angular/compiler": "4.0.0", "@angular/compiler-cli": "4.0.0", "@angular/core": "4.0.0", "@angular/forms": "4.0.0", "@angular/http": "4.0.0", "@angular/platform-browser": "4.0.0", "@angular/platform-browser-dynamic": "4.0.0", "@ionic-native/core": "3.4.2", "@ionic-native/splash-screen": "3.4.2", "@ionic-native/status-bar": "3.4.2", "@ionic/storage": "2.0.1", "ionic-angular": "3.0.1", "ionicons": "3.0.0", "rxjs": "5.1.1", "sw-toolbox": "3.4.0", "zone.js": "^0.8.4"},"devDependencies": { "@ionic/app-scripts": "1.3.0", "typescript": "~2.2.1"}.3 重新npm install，如果在国内的话，请在后面添加参数以加快速度<code>--registry=https://registry.npm.taobao.org</code>。
2.使用lazy loading
使用懒加载能够减少程序启动时间，减少打包后的体积，而且可以很方便的使用路由的功能。
注意：如果之前使用了<code>DeepLinkConfig</code>请先删除，因为要在每个页面添加<code>IonicPage</code>修饰符
接下来为了展示lazy loading 的使用，我们将新建一个 空的 ionic 项目。 在app.module.ts中，我们可以看到：
import { HomePage } from '../pages/home/home';
....@NgModule({
declarations: [
MyApp,
HomePage
],
entryComponents: [
MyApp,
HomePage
],
})现在我们想让程序只加载app.component.ts,而让 <code>HomePage</code>被懒加载。
因此我们把app.module.ts中有关HomePage的引用和声明删掉，变成:
....@NgModule({
declarations: [
MyApp
],
entryComponents: [
MyApp
],
})接下来需要在
└home ├─ home.html ├─ home.scss └─ home.ts
中增加一个home.module.ts文件，如下：
import { NgModule } from '@angular/core';
import { HomePage} from './home’;
import { IonicPageModule } from 'ionic-angular';
@NgModule({
declarations: [HomePage],
imports: [IonicPageModule.forChild(HomePage)],
})
export class HomePageModule { }接下来，修改home.ts的文件，增加@IonicPage修饰。如下：
import { Component } from '@angular/core';import { IonicPage } from 'ionic-angular';
@IonicPage()
@Component({
---
})export class HomePage {现在我们的HomePage已经可以懒加载了，我们不必再直接在app.component.ts使用import { TabsPage } from '../pages/tabs/tabs';这样的方式引用，现在需要改成：
//原先是这样的，/*
import { HomePage } from '../pages/home/home';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
rootPage:any = HomePage;
*///现在是这样的。@Component({
templateUrl: 'app.html'})
export class MyApp {
rootPage:any = 'HomePage'; //此处改成了字符串我们可以看到现在改成了字符串HomePage（注意这个值要跟组件中声明的值一致）。这个字符串其实是跟@IonicPage()声明的name是一致的，默认与组件名一致。
上面便可以把组件的懒加载实现了。
3. 重新组织 Components/Providers/Pipes文件，
对于Component官方给的建议是：
One module that imports all component classes, no individual modules for each component。（官方也是无奈啊，目前只有简单的实现）
components/ components.module.ts (ComponentsModule) imports and exports all components the user creates component1/ component1.ts component1.html component2/ component2.ts component2.html
按照这样的方式使用ionic 生成页面的工具，将自动在ComponentsModule引入。
对于 Pipes
同样的，适时添加module
pipes/ pipes.module.ts (PipesModule) imports and exports all pipes the user creates pipe1.ts pipe2.ts
对Providers来说，没有相对应的module，可以使用 主的ngmodule进行配置（这个可以在每个component中进行声明）
作者：cpu_driver
链接：https://www.jianshu.com/p/a445b497cb60
随时随地看视频
