浅谈Angular4实现热加载开发旅程


Posted in Javascript onSeptember 08, 2017

本文介绍了Angular4实现热加载开发,分享给大家,具体如下:

安装插件

npm install @angularclass/hmr -D

配置插件

// main.ts
if (environment.production) {
 enableProdMode();
}else {
 if (module.hot) {
  module.hot.accept();
  module.hot.dispose(() => {
   let _styles = document.head.querySelectorAll('style');
   let styles = Array.prototype.slice.call(_styles);
   styles
    .filter((style: any) => style.innerText.indexOf('_ng') !== -1)
    .map((el: any) => document.head.removeChild(el));
  })
 }
}

platformBrowserDynamic().bootstrapModule(AppModule);

配置Typescript

// typings.d.ts
declare var module: NodeModule;
interface NodeModule {
 hot: any;
}

启用热加载

// package.json
ng serve -H d.io --port 3000 --hmr --proxy-config=./proxy.json

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS可以控制样式的名称写法一览
Jan 16 Javascript
For循环中分号隔开的3部分的执行顺序探讨
May 27 Javascript
EasyUI创建对话框的两种方式
Aug 23 Javascript
JQuery控制DIV的选取实现方法
Sep 18 Javascript
如何正确理解javascript的模块化
Mar 02 Javascript
详解vue2.0组件通信各种情况总结与实例分析
Mar 22 Javascript
jquery实现全选、全不选以及单选功能
Mar 23 jQuery
JS实现简单抖动效果
Jun 01 Javascript
微信小程序form表单组件示例代码
Jul 15 Javascript
Vue用v-for给循环标签自身属性添加属性值的方法
Oct 18 Javascript
小程序实现搜索界面 小程序实现推荐搜索列表效果
May 18 Javascript
jQuery操作事件完整实例分析
Jan 10 jQuery
js匿名函数使用&传参(实例)
Sep 08 #Javascript
js HTML5 canvas绘制图片的方法
Sep 08 #Javascript
WebStorm ES6 语法支持设置&babel使用及自动编译(详解)
Sep 08 #Javascript
React如何将组件渲染到指定DOM节点详解
Sep 08 #Javascript
javascript获取指定区间范围随机数的方法
Sep 08 #Javascript
原生js实现简单的模态框示例
Sep 08 #Javascript
javascript 面向对象实战思想分享
Sep 07 #Javascript
You might like
暴雪前总裁遗憾:没尽早追赶Dota 取消星际争霸幽灵
2020/03/08 星际争霸
DISCUZ 论坛管理员密码忘记的解决方法
2009/05/14 PHP
php微信浏览器分享设置以及回调详解
2016/08/01 PHP
Prototype源码浅析 String部分(四)之补充
2012/01/16 Javascript
js/jQuery对象互转(快速操作dom元素)
2013/02/04 Javascript
jquery获取当前日期的方法
2015/01/14 Javascript
jquery解析json格式数据的方法(对象、字符串)
2015/11/24 Javascript
JS控制按钮10秒钟后可用的方法
2015/12/22 Javascript
JS中取二维数组中最大值的方法汇总
2016/04/17 Javascript
jQuery根据name属性进行查找的用法分析
2016/06/23 Javascript
JS实现复选框的全选和批量删除功能
2017/04/05 Javascript
浅谈JavaScript作用域和闭包
2017/09/18 Javascript
laravel5.3 vue 实现收藏夹功能实例详解
2018/01/21 Javascript
JavaScript中.min.js和.js文件的区别讲解
2019/02/13 Javascript
解决vue中el-tab-pane切换的问题
2020/07/19 Javascript
[41:41]TFT vs Secret Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
Python多线程处理实例详解【单进程/多进程】
2019/01/30 Python
pymongo中聚合查询的使用方法
2019/03/22 Python
Opencv-Python图像透视变换cv2.warpPerspective的示例
2019/04/11 Python
解决Python3 控制台输出InsecureRequestWarning问题
2019/07/15 Python
Python函数参数分类原理详解
2020/05/28 Python
Stylenanda中文站:韩国一线网络服装品牌
2016/12/22 全球购物
Tech21美国/加拿大:英国NO.1防摔保护壳品牌
2018/01/20 全球购物
一分钟演讲稿
2014/04/30 职场文书
主要领导对照检查材料
2014/08/26 职场文书
2014村书记党建工作汇报材料
2014/11/02 职场文书
2014年客房服务员工作总结
2014/11/18 职场文书
敬老院志愿者活动总结
2015/05/06 职场文书
2016毕业实习单位评语大全
2015/12/01 职场文书
《扇形统计图》教学反思
2016/02/17 职场文书
MySQL索引篇之千万级数据实战测试
2021/04/05 MySQL
用python批量解压带密码的压缩包
2021/05/31 Python
Java 超详细讲解十大排序算法面试无忧
2022/04/08 Java/Android
《艾尔登法环》Boss腐烂树灵很有可能是《黑暗之魂3》的一个废案
2022/04/11 其他游戏
解决 Redis 秒杀超卖场景的高并发
2022/04/12 Redis
Go微服务项目配置文件的定义和读取示例详解
2022/06/21 Golang