当我们在开发前端的时候，经常需要进行代码的调试和编译。每次更新代码后需要重新运行命令，这样会浪费很多时间。而 start-watch-debounce 包可以帮助我们解决这个问题。下面是该包的使用教程，其中包含了详细的使用指南和示例代码。
安装 start-watch-debounce
首先需要用 npm 安装 start-watch-debounce 包。在终端中输入以下命令安装该包：
npm install --save-dev start-watch-debounce
使用 start-watch-debounce
- 在 package.json 文件中添加以下代码：
"scripts": {
"start": "start-watch-debounce ./src/index.js -p 3000 -w",
}这里的 ./src/index.js 是我们要执行的文件路径，-p 3000 表示我们要监听的端口号是 3000，-w 表示我们要开启 watch 模式。
- 输入以下命令开始运行 start-watch-debounce：
npm start
此时 start-watch-debounce 会启动监听，如果我们更改了代码，它会立即重新编译并在浏览器中更新。
高级用法
start-watch-debounce 除了上述基础用法，还可以进行一些高级配置。
修改 debounce 时间
start-watch-debounce 默认的 debounce 时间是 200 毫秒，你可以在 package.json 文件中修改：
{
"startWatchDebounce": {
"debounce": 1000
}
}执行指令
在 start-watch-debounce 中，我们可以添加执行指令：
"scripts": {
"build": "webpack",
"start": "start-watch-debounce ./src/index.js -p 3000 -w -c build",
}这里的 -c 表示要执行的指令（command），build 表示我们要执行的指令名字。
配置监听目录
我们可以在 package.json 文件中配置 watch 的目录：
{
"startWatchDebounce": {
"watchDirs": [
"src",
"lib"
],
}
}这里的 watchDirs 表示要监听的目录，我们可以在其中添加我们需要监听的目录。
示例代码
最后，我们来看一个示例代码：
-- -------------------- ---- -------
--------- -----
------
------
--------------------------- ----------
-------
------
------- ------------------------------
-------
-------在 package.json 中添加以下代码：
"scripts": {
"start": "start-watch-debounce ./src/index.js -p 3000 -w"
}执行以下命令：
npm start
这样，我们就完成了 start-watch-debounce 的基础用法部分。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600554a281e8991b448d1dcc