什么是 browserify-livereload？
browserify-livereload 是基于 browserify 和 gulp 等构建工具的一个 npm 包，可以实现前端代码的自动打包和热重载，从而提升开发效率。它的主要特点包括：
- 支持编译 ES6、CSS、LESS、SASS 等多种类型的文件；
- 支持打包压缩混淆，提高前端代码的性能；
- 支持自动重载，无需手动刷新浏览器即可查看代码修改效果。
安装和使用
在开始使用 browserify-livereload 之前，首先需要确保你已经安装了 Node.js 和 npm。然后可以按照以下步骤进行安装：
在终端中进入项目目录，执行以下命令安装 browserify-livereload：
npm install browserify-livereload --save-dev
此时，可以在项目根目录下创建一个名为 gulpfile.js 的文件，并引入相关依赖和配置 gulp 任务：
-- -------------------- ---- ------- -- ---- ----- ---- - ---------------- ----- ---------- - ---------------------- ----- ------ - ------------------------------- ----- ------ - ------------------------ ----- ---------- - --------------------------- ----- ------ - ----------------------- ----- ---------- - --------------------------- ----- -------------------- - --------------------------------- -- ---- ------------------ ---------- - ------ ------------ -------- ------------------ -- -------------------------------- --------- -------------------------- --------------- -------------------------------- ------- ----------------------------- -------------------------- --------------------- --------- -------------------------- -------------------- --- ------------------ ---------- - -------------------- -------------------------- ---------------------- --- -------------------- -------------------- ----------最后，在终端中执行以下命令，在浏览器中打开 http://localhost:8080 查看效果：
gulp
以上就是使用 browserify-livereload 的基本流程，可以根据自己的需求进行自定义配置。
示例代码
下面是一个简单的示例代码，演示了如何使用 browserify-livereload 编译 ES6 和 LESS，并通过自动重载在浏览器中查看效果：
-- -------------------- ---- ------- -- -------- ------ --------------- ----- ----- - ------- -------- ------------------- -- ---------- ---- - ------ ----- -
在终端中执行以下命令，即可自动编译并重载浏览器：
gulp
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066c8cccdc64669dde53e1