在前端开发过程中，当修改代码后需要手动刷新浏览器，耗费了不少的时间。为了提高效率，我们可以使用bs-systemjs-hot-reloader，它可以监听代码变化，并自动刷新浏览器。本篇文章将介绍bs-systemjs-hot-reloader的使用教程。
安装
使用npm进行安装：
npm install bs-systemjs-hot-reloader --save-dev
配置
在bs-config.js中添加以下内容：
-- -------------------- ---- -------
--- ----------- - ---------------------------------
--- --------------- - ----------------------------
--- --------------------- - ------------------------------------
--- ------- - --- ----------------------
--- ------------- - -
---------- --------------
------------- -
-------------- -----
-------- -------
-
--
-------------------------------------- -------- ---------------
-------------- - -
------- -
-------- ----
--
------ -
------------
--------
-
--bsSystemjsHotReloader的参数有三个，分别是SystemJSBuilder对象、浏览器自动刷新的选项对象和构建器可以使用的浏览器重新加载的文件名。这里我们使用startPath选项设置默认打开index.html页面。
示例代码
使用bs-systemjs-hot-reloader的示例代码：
-- -------------------- ---- -------
------------------------------------ -- -
------------------------ ----------
----------------- ------- -
---------------------
---
-- ------------ -
--------------------
-当app.js文件发生变化时，浏览器将自动刷新。如果使用了热模块替换（HMR），修改的模块将会自动更新而不会导致整个页面重新加载。
结论
在前端开发过程中，使用bs-systemjs-hot-reloader可以显著提高效率。本文介绍了bs-systemjs-hot-reloader的使用教程和示例代码，希望能对您有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066c8bccdc64669dde5381