前言
在前端开发中，我们经常会用到打包工具来将我们的代码进行压缩和组合，以便在生产环境下更快地加载我们的应用程序。而 rollup 是一个非常流行的打包工具，它能够将我们的 JavaScript 模块打包成一个单一的文件，这就可以减少文件的数量和大小，进而提高我们的应用程序的性能。
什么是 rollup-watch
rollup-watch 是 rollup 中一个很有用的插件，它可以帮助我们自动化地打包我们的代码，并在代码发生变化时重新打包。这样，我们就可以很方便地监测文件变化，实时编译打包我们的代码了。
安装 rollup-watch
安装 rollup-watch 很简单，只需要在终端窗口下运行下面的命令即可。
npm install rollup-watch --save-dev
使用 rollup-watch
配置 rollup-watch 也很简单，我们可以直接在 rollup.config.js 文件中添加对应的设置即可。下面是一个示例配置。
-- -------------------- ---- -------
------ ----------- ---- ---------------
------ ------- -
------ ---------------
------- -
----- -----------------
------- -------
--
-------- -
-------------
------------ ------
---
--
--在上面的代码中，我们首先导入了 rollup-watch 模块，然后我们向 plugins 数组中加入了 rollup-watch 的设置，我们还可以设置它的一些选项，例如：clearScreen，表示每次重新编译时是否清除控制台输出。
接下来我们可以在终端窗口下运行以下命令来启动 rollup-watch。
rollup -c --watch
在默认情况下，每当您更改代码时，rollup-watch 都会自动重新编译它。当它完成后，您会看到以下消息。
bundle.js created dist/bundle.js in 985ms
当您再次更改代码时，rollup-watch 将再次重新编译您的代码，并再次输出打包成功的消息。
总结
通过本文，我们学习了如何使用 npm 包 rollup-watch 来帮助我们在开发过程中自动化构建和打包我们的代码，并在代码发生变化时重新构建它。这极大地提高了我们的 JavaScript 应用程序的开发效率，并有助于我们追踪错误并快速得到反馈。希望本文对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/40418