npm 包@lukekarrys/score-watcher 的使用教程-JavaScript中文网-JavaScript教程资源分享门户

简介

在前端开发中，我们常常需要追踪项目的代码变化，并根据代码变化来做出相应的响应。而@lukekarrys/score-watcher 就是一款帮助开发者实现代码变化监测，并自动进行相应操作的 npm 包。

安装

首先，你需要在你的项目中安装@lukekarrys/score-watcher。你可以直接使用 npm 或 yarn 进行安装：

npm install @lukekarrys/score-watcher

或者

yarn add @lukekarrys/score-watcher

使用

监听文件夹

最简单的使用场景是监听文件夹下指定文件类型的变化，并在变化时进行指定的操作。

const ScoreWatcher = require("@lukekarrys/score-watcher");

const watcher = new ScoreWatcher({
  files: ["src/**/*.js", "src/**/*.css"],
  command: "npm build",
});

watcher.start();

以上代码中，我们使用 ScoreWatcher 构造函数构建了一个 ScoreWatcher 实例，然后调用 start() 方法启动监听。

这段代码将会监听 src 文件夹下以.js 和.css 结尾的所有文件，一旦这些文件发生变化，就会运行 npm run build 命令。

自定义事件

Watcher 对象实例的事件列表：

start 监听开始
end 监听结束
change 文件发生变化

listener 函数回调参数：

filename发生变化的文件名称
event 监听事件名称, 'add' 添加， 'change' 修改， 'unlink' 删除

-- -------------------- ---- -------
----- ------------ - -------------------------------------

----- ------- - --- --------------
  ------ --------------- ----------------
---

------------------- -- -- -
  --------------------
---

-------------------- ---------- ------ -- -
  --------------- ----------- --- -------- -----
---

----------------- -- -- -
  --------------------
---

----------------

以上代码中，我们对 ScoreWatcher 实例进行了监听，监听 start 事件，输出“监听开始”；然后监听 change 事件，输出变化文件名及变化类型；最后监听 end 事件，输出“监听结束”。

控制边界和高阶模式

-- -------------------- ---- -------
----- ------------ - -------------------------------------

----- ------- - --- --------------
  ------ --------------- ----------------
---

----------------------- -- -
  --------------------
---

-- -----------
------------- -- -
  ------------------------- -- -
    --------------------
  ---
-- --------

以上代码中，我们监听了 ScoreWatcher 实例的 watch 方法，该方法返回一个 Promise，当监听开始时，Promise 被解析。然后我们设置一个计时器，在 10 分钟后停止监听，此时 Promise 被拒绝并输出“监听结束”。

属性选项

files?: string[] 要监听的文件
command: string 文件变化时要运行的命令或脚本字符串
watchman?: boolean 是否使用 watchman 的 watch 命令来监视文件
debounce?: number 按场地书防抖间隔时间(默认200ms)
cwd?: string 所有相对路径都将相对于此路径解析（默认为当前目录）
ignoreInitial?: boolean 是否要忽略初始扫描（默认为 true）
followSymlinks?: boolean 是否要监视符号链接文件（默认为false）
forceWatchMethod?: boolean alpha 版本特性，设置为 true，将在 Windows 上强制使用轮询（默认为 false）

推荐用法

1. 使用 ScoreWatcher 监控文件更改，并使用 nodemon 自动重启应用

-- -------------------- ---- -------
----- ------------ - -------------------------------------
----- ------- - -------------------

-- ------------
----- ------- - --- --------------
  ------ ----------------
  -------- ---- -------
---
-------------------- -- -- -
  ------------------
---
----------------

2. 使用 ScoreWatcher 监控文件更改和 webpack 自动重编译

-- -------------------- ---- -------
----- ------------ - -------------------------------------
----- ------- - -------------------

-- ----------- -------
----- ------- - --- --------------
  ------ --------------- ----------------
  -------- -------- -------- ----------------
---
-------------------- -- -- -
  ----------------- -------- ----------------
  ------------------------------------ ----- -- -
    -- ----- -
      -------------------- -------- -----
    - ---- -
      -------------------- ------- --------
    -
  ---
---
----------------

结论

@lukekarrys/score-watcher 是一款强大的工具，可以帮助开发者更加高效地进行项目开发。通过本文的简单介绍和详细的使用说明，你应该已经可以使用它了，希望这款 npm 包能为你带来更好的编程体验！

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/60066bc7967216659e244579