ionic3 懒加载


Posted in Javascript onAugust 16, 2017

ionic3 默认使用了懒加载技术,相较以前预加载的版本,ionic3构建的app在首页加载时间上有较大的优化,但是,ionic3默认每个页面都会对应一个模块,对于页面较多,但是每个模块都很小的应用可能并不怎么合理。于是,尝试将几个小模块合并为几个大的模块。

1. 一个模块对应一个页面:

默认状态下每个页面都会对应一个模块,如果项目之中的页面比较多那么最后构建的项目中的将会看到有很多的 js 。

原setting.module.ts

import { NgModule } from '@angular/core';
 import { IonicPageModule } from 'ionic-angular';
 import { SettingPage } from './setting';
 @NgModule({
  declarations: [
   SettingPage,
  ],
  imports: [
   IonicPageModule.forChild(SettingPage),
  ],
  entryComponents: [
   SettingPage,
  ]
 })
 export class SettingPageModule {}

2. 一个模块对应多个页面

修改后的setting.module.ts 

import { NgModule } from '@angular/core';
 import { IonicPageModule } from 'ionic-angular';
 import { SettingPage } from './setting';
 import {UserPasswordPageModule} from "./user-password/user-password.module";
 import {UsernamePageModule} from "./username/username.module";
 @NgModule({
  declarations: [
   SettingPage,
  ],
  imports: [
   IonicPageModule.forChild(SettingPage),
   //将两个子页面模块引入
   UserPasswordPageModule,
   UsernamePageModule,
  ],
  entryComponents: [
   SettingPage,
  ]
 })
 export class SettingPageModule {}

总结

以上所述是小编给大家介绍的ionic3 懒加载,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript生成/解析dom的CDATA类型的字段的代码
Apr 22 Javascript
使用js判断控件是否获得焦点
Jan 03 Javascript
jQuery中replaceAll()方法用法实例
Jan 16 Javascript
JQuery工具函数汇总
Jun 15 Javascript
jQuery中cookie插件用法实例分析
Dec 04 Javascript
Vue图片浏览组件v-viewer用法分析【支持旋转、缩放、翻转等操作】
Nov 04 Javascript
微信小程序缓存支持二次开发封装实现解析
Dec 16 Javascript
jQuery实现视频展示效果
May 30 jQuery
vue 导出文件,携带请求头token操作
Sep 10 Javascript
ant design vue导航菜单与路由配置操作
Oct 28 Javascript
基于JavaScript实现轮播图效果
Jan 02 Javascript
JavaScript实现打字游戏
Feb 19 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
Aug 16 #Javascript
理解 Node.js 事件驱动机制的原理
Aug 16 #Javascript
JavaScript选取(picking)和反选(rejecting)对象的属性方法
Aug 16 #Javascript
JavaScript-定时器0~9抽奖系统详解(代码)
Aug 16 #Javascript
vue实现留言板todolist功能
Aug 16 #Javascript
Angularjs中的验证input输入框只能输入数字和小数点的写法(推荐)
Aug 16 #Javascript
vue的事件绑定与方法详解
Aug 16 #Javascript
You might like
DOTA2游戏同人动画《龙之血》导演接受采访
2021/03/05 欧美动漫
PHP学习之PHP变量
2006/10/09 PHP
php getcwd与dirname(__FILE__)区别详解
2016/09/24 PHP
MooTools 页面滚动浮动层智能定位实现代码
2011/08/23 Javascript
jquery $(this).attr $(this).val方法使用介绍
2013/10/08 Javascript
js读取被点击次数的简单实例(从数据库中读取)
2014/03/07 Javascript
JS常用字符串处理方法应用总结
2014/05/22 Javascript
一张Web前端的思维导图分享
2015/07/03 Javascript
js实现仿Discuz文本框弹出层效果
2015/08/13 Javascript
Bootstrap项目实战之子栏目资讯内容
2016/04/25 Javascript
使用Web Uploader实现多文件上传
2016/06/08 Javascript
详解使用vue-router进行页面切换时滚动条位置与滚动监听事件
2017/03/08 Javascript
react native带索引的城市列表组件的实例代码
2017/08/08 Javascript
JS实现简单表格排序操作示例
2017/10/07 Javascript
VUE Error: getaddrinfo ENOTFOUND localhost
2018/05/03 Javascript
vue底部加载更多的实例代码
2018/06/29 Javascript
vue 刷新之后 嵌套路由不变 重新渲染页面的方法
2018/09/13 Javascript
使用NestJS开发Node.js应用的方法
2018/12/03 Javascript
vue微信分享的实现(在当前页面分享其他页面)
2019/04/16 Javascript
对Layer UI 模块化的用法详解
2019/09/26 Javascript
[03:52]显微镜下的DOTA2第三期——英雄在无聊的时候干什么
2014/06/20 DOTA
[23:21]Ti4 冒泡赛第二轮DK vs C9 2
2014/07/14 DOTA
[02:17]2016国际邀请赛中国区预选赛VG战队领队采访
2016/06/26 DOTA
[27:08]完美世界DOTA2联赛PWL S2 SZ vs Rebirth 第二场 11.21
2020/11/23 DOTA
在Python 3中实现类型检查器的简单方法
2015/07/03 Python
python xlsxwriter创建excel图表的方法
2018/06/11 Python
Python基于多线程实现抓取数据存入数据库的方法
2018/06/22 Python
遮罩层 + Iframe实现界面自动显示的示例代码
2020/04/26 HTML / CSS
女子锻炼服装和瑜伽服装:Splits59
2019/03/04 全球购物
碧欧泉法国官网:Biotherm法国
2019/10/23 全球购物
腾讯技术类校园招聘笔试试题
2014/05/06 面试题
铁路个人事迹材料
2014/01/30 职场文书
2015纪念九一八事变84周年演讲稿
2015/03/19 职场文书
node.js使用express-fileupload中间件实现文件上传
2021/07/16 Javascript
MySQL千万级数据表的优化实战记录
2021/08/04 MySQL
MySQL 中如何归档数据的实现方法
2022/03/16 SQL Server