浅谈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 动态获取节点代码innerHTML分析 [IE,FF]
Nov 30 Javascript
jQuery动态添加的元素绑定事件处理函数代码
Aug 02 Javascript
解析js中获得父窗口链接getParent方法以及各种打开窗口的方法
Jun 19 Javascript
JQuery实现动态适时改变字体颜色的方法
Mar 10 Javascript
chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式
Oct 09 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
Aug 31 Javascript
js实现各种复制到剪贴板的方法(分享)
Oct 27 Javascript
详解JS中统计函数执行次数与执行时间
Sep 04 Javascript
详解js中Array的方法及技巧
Sep 12 Javascript
2种在vue项目中使用百度地图的简单方法
Sep 28 Javascript
vue.js实现照片放大功能
Jun 23 Javascript
Vue3.0 手写放大镜效果
Jul 25 Vue.js
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
追忆往昔!浅谈收音机的百年发展历史
2021/03/01 无线电
PHP.MVC的模板标签系统(五)
2006/09/05 PHP
隐藏你的.php文件的实现方法
2007/03/19 PHP
PHP生成唯一的促销/优惠/折扣码(附源码)
2012/12/28 PHP
解析用PHP读写音频文件信息的详解(支持WMA和MP3)
2013/05/10 PHP
destoon网站转移服务器后搜索汉字出现乱码的解决方法
2014/06/21 PHP
php中出现空白页的原因及解决方法汇总
2014/07/08 PHP
php上传图片类及用法示例
2016/05/11 PHP
PHP连接MySQL数据库三种实现方法
2020/12/10 PHP
js css样式操作代码(批量操作)
2009/10/09 Javascript
模拟jQuery ajax服务器端与客户端通信的代码
2011/03/28 Javascript
Extjs4.0设置Ext.data.Store传参的请求方式(默认为GET)
2013/04/02 Javascript
JavaScript字符串对象charAt方法入门实例(用于取得指定位置的字符)
2014/10/17 Javascript
javascript 对象数组根据对象object key的值排序
2015/03/09 Javascript
javascript去掉代码里面的注释
2015/07/24 Javascript
基于bootstrap插件实现autocomplete自动完成表单
2016/05/07 Javascript
浅析location.href跨窗口调用函数
2016/11/22 Javascript
JavaScript实现购物车基本功能
2017/07/21 Javascript
微信小程序之前台循环数据绑定
2017/08/18 Javascript
jQuery实现table表格checkbox全选的方法分析
2018/07/04 jQuery
解决jquery的ajax调取后端数据成功却渲染失败的问题
2018/08/08 jQuery
[02:13] 完美世界DOTA2联赛PWL DAY5集锦
2020/11/03 DOTA
Python牛刀小试密码爆破
2011/02/03 Python
在Python的框架中为MySQL实现restful接口的教程
2015/04/08 Python
整理Python最基本的操作字典的方法
2015/04/24 Python
使用Python实现图像标记点的坐标输出功能
2019/08/14 Python
Python 面向对象之封装、继承、多态操作实例分析
2019/11/21 Python
what is the difference between ext2 and ext3
2015/08/25 面试题
Linux面试题LINUX系统类
2014/11/19 面试题
企业安全生产承诺书
2014/05/22 职场文书
软件测试专业推荐信
2014/09/18 职场文书
《揠苗助长》教学反思
2016/02/20 职场文书
python操作xlsx格式文件并读取
2021/06/02 Python
简单介绍Python的第三方库yaml
2021/06/18 Python
JavaScript中document.activeELement焦点元素介绍
2021/11/27 Javascript
基于Redis zSet实现滑动窗口对短信进行防刷限流的问题
2022/02/12 Redis