在前端开发中，我们经常需要一些工具来协助我们完成一些任务，比如截取网站的快照。这时候，一个非常好用的 npm 包 site-shutter 应运而生。
site-shutter 是什么？
site-shutter 是一个用于截取网站截图的 npm 包。它基于 Puppeteer 技术，可以模拟浏览器行为访问网站，并返回网站的截图。
如何安装和使用？
使用 npm 标准命令来进行安装：
npm install site-shutter --save
安装完成后，我们就可以在项目代码中引用它：
const siteShutter = require('site-shutter');接下来，让我们看看如何使用 site-shutter 来完成截图操作。
API 方法介绍
siteShutter.captureScreenshot(url, outputFile, options)：截取指定 url 对应网站的截图。
参数说明：
url：指定需要截图的 url。outputFile：指定截图存储路径，支持 JPG 和 PNG 格式。options：可选参数。其中options参数是一个包含各种截图配置项的对象。
options 支持的配置项如下：
width：截图宽度，单位为像素。height：截图高度，单位为像素。fullPage：是否截取整个页面。type：截图类型，支持 JPG 和 PNG。quality：截图质量，取值范围为 0-100。
使用示例
接下来，我们来看一下使用示例。
-- -------------------- ---- -------
----- ----------- - ------------------------
----- -------- ------------- -
--- -
----- --- - -------------------------
----- ---------- - -------------
----- ------- - -
------ -----
------- ----
--------- ------
----- ------
-------- --
--
----- ---------------------------------- ----------- ---------
---------------------
- ---------- -
-------------------
-
-
--------------我们可以先定义一个 captureDemo 函数，用于执行截图操作。在函数内部，我们可以设置需要截图的网址、存储路径以及一些截图参数，然后调用 siteShutter.captureScreenshot() 方法，执行截图操作。最后，我们输出一条信息，表示截图完成。
总结
site-shutter 是一款非常实用的 npm 包，可以帮助我们快速完成网站截图操作。掌握了 site-shutter 的使用方法，我们就可以在开发过程中更加高效地使用截图工具来辅助我们完成一些任务。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005577981e8991b448d478b