pageres 完整指南三步批量生成多分辨率网站截图【免费下载链接】pageresCapture website screenshots项目地址: https://gitcode.com/gh_mirrors/pa/pagerespageres 是一个面向 Node.js 的网站截图库给定一个或多个网址及其目标分辨率它会启动无头浏览器按各尺寸批量抓取页面。它适合前端开发、测试人员以及需要快速产出文档配图、宣传素材的用户也可用于渲染 SVG 图像。当前 npm 版本为 9.0.0MIT 协议要求 Node.js 20 及以上。功能清单pageres 能做什么除基础的多分辨率截图外它对几类不好截的场景也有覆盖能力实现方式多分辨率批量截图.source()传入[480x320, 1024x768]之类的尺寸数组HTML 直接渲染.sourceHtml()无需部署页面传入 HTML 字符串即可渲染截图元素级捕获selector只截指定 DOM 元素hide隐藏干扰元素clickElement先点击再截图登录态与请求定制cookies、username/passwordHTTP 认证、headers、userAgent输出控制format支持 png/jpgfilename用 Lo-Dash 模板自定义命名incrementalName自动递增避免覆盖环境模拟darkMode深色模式、transparent透明背景、scale页面缩放、delay等待动画SVG 渲染可兼作 SVG 转位图的渲染工具官方 README 给出的性能数据是10 个不同网站共 100 张截图耗时略超一分钟足以应付 CI 里的批量任务。三步快速上手整个流程只有三步安装执行npm install pageres。想先看源码的话克隆仓库git clone https://gitcode.com/gh_mirrors/pa/pageres声明目标创建Pageres实例链式调用一个或多个.source(url, sizes, options?)或.sourceHtml(html, sizes)声明哪些页面、哪些尺寸。第三个参数 options 可以覆盖构造器里的全局设置方便按页面单独配置。运行调用.destination(screenshots)指定输出目录再调用.run()它返回一个 Promiseresolve 为截图图片数据Uint8Array 数组。仓库里的 example.js 是一个可直接参考的完整示例全部参数的说明见 readme.md。常用参数详解五个高频场景页面加载慢delay秒用于等待动画或懒加载完成再截图timeout默认 60 秒超时自动中断请求。固定尺寸海报crop: true会把画面裁剪到设定高度避免页面内容不足时画面被拉伸留白。定期截图归档filename支持date、time、url、size、crop等模板变量配合incrementalName: true可保证历史文件永不被覆盖。只截主体区域用selector锁定内容容器hide去掉广告等干扰项更复杂的交互交给beforeScreenshot钩子它接收 Puppeteer 的 Page 实例可以在截图前点击同意按钮、等待指定元素出现。深色模式 / 透明底darkMode模拟深色配色偏好transparent在页面未设置背景时输出透明背景适合做图标和宣传素材。完整参数类型定义与默认值见 source/index.ts 中的选项注释。集成与生态命令行用法命令行版本是独立的 pageres-cli 项目本仓库只提供库本身。任务运行器Grunt 用户可用 grunt-pageres 插件Gulp、Broccoli 直接调用 API 即可官方认为没必要再包一层。底层实现截图工作委托给依赖capture-website基于 Puppeteer完成浏览器启动问题可通过launchOptions透传给puppeteer.launch()解决。衍生项目桌面应用 Break Shot 基于该库构建用于响应式网站截图。环境注意事项要求Node.js 20见 package.json 的engines字段。Linux 用户若报No usable sandbox!错误需要按 Chrome 官方文档启用系统级沙箱这是 README 中专门提示的常见坑。仓库自带测试套件覆盖各参数行为本地起 HTTP 服务并用真实截图的像素尺寸做断言见 test/。下一步建议先跑一遍 example.js 的示例对自己负责的站点做一次多分辨率截图。目标是响应式测试的话建议挑 3~4 个尺寸兼顾手机如 480x320与桌面如 1920x1080。若接入 CI注意合理设置timeout与delay避免用例偶发失败。仓库当前没有公开的 CHANGELOG 文件以上均为 9.0.0 版本的已实现能力后续规划以项目后续的发布说明为准。【免费下载链接】pageresCapture website screenshots项目地址: https://gitcode.com/gh_mirrors/pa/pageres创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 
长河君 · 2026/11/6 6:27:15 · 阅读 1.2k pageres 完整指南：三步批量生成多分辨率网站截图
pageres 完整指南三步批量生成多分辨率网站截图【免费下载链接】pageresCapture website screenshots项目地址: https://gitcode.com/gh_mirrors/pa/pagerespageres 是一个面向 Node.js 的网站截图库给定一个或多个网址及其目标分辨率它会启动无头浏览器按各尺寸批量抓取页面。它适合前端开发、测试人员以及需要快速产出文档配图、宣传素材的用户也可用于渲染 SVG 图像。当前 npm 版本为 9.0.0MIT 协议要求 Node.js 20 及以上。功能清单pageres 能做什么除基础的多分辨率截图外它对几类不好截的场景也有覆盖能力实现方式多分辨率批量截图.source()传入[480x320, 1024x768]之类的尺寸数组HTML 直接渲染.sourceHtml()无需部署页面传入 HTML 字符串即可渲染截图元素级捕获selector只截指定 DOM 元素hide隐藏干扰元素clickElement先点击再截图登录态与请求定制cookies、username/passwordHTTP 认证、headers、userAgent输出控制format支持 png/jpgfilename用 Lo-Dash 模板自定义命名incrementalName自动递增避免覆盖环境模拟darkMode深色模式、transparent透明背景、scale页面缩放、delay等待动画SVG 渲染可兼作 SVG 转位图的渲染工具官方 README 给出的性能数据是10 个不同网站共 100 张截图耗时略超一分钟足以应付 CI 里的批量任务。三步快速上手整个流程只有三步安装执行npm install pageres。想先看源码的话克隆仓库git clone https://gitcode.com/gh_mirrors/pa/pageres声明目标创建Pageres实例链式调用一个或多个.source(url, sizes, options?)或.sourceHtml(html, sizes)声明哪些页面、哪些尺寸。第三个参数 options 可以覆盖构造器里的全局设置方便按页面单独配置。运行调用.destination(screenshots)指定输出目录再调用.run()它返回一个 Promiseresolve 为截图图片数据Uint8Array 数组。仓库里的 example.js 是一个可直接参考的完整示例全部参数的说明见 readme.md。常用参数详解五个高频场景页面加载慢delay秒用于等待动画或懒加载完成再截图timeout默认 60 秒超时自动中断请求。固定尺寸海报crop: true会把画面裁剪到设定高度避免页面内容不足时画面被拉伸留白。定期截图归档filename支持date、time、url、size、crop等模板变量配合incrementalName: true可保证历史文件永不被覆盖。只截主体区域用selector锁定内容容器hide去掉广告等干扰项更复杂的交互交给beforeScreenshot钩子它接收 Puppeteer 的 Page 实例可以在截图前点击同意按钮、等待指定元素出现。深色模式 / 透明底darkMode模拟深色配色偏好transparent在页面未设置背景时输出透明背景适合做图标和宣传素材。完整参数类型定义与默认值见 source/index.ts 中的选项注释。集成与生态命令行用法命令行版本是独立的 pageres-cli 项目本仓库只提供库本身。任务运行器Grunt 用户可用 grunt-pageres 插件Gulp、Broccoli 直接调用 API 即可官方认为没必要再包一层。底层实现截图工作委托给依赖capture-website基于 Puppeteer完成浏览器启动问题可通过launchOptions透传给puppeteer.launch()解决。衍生项目桌面应用 Break Shot 基于该库构建用于响应式网站截图。环境注意事项要求Node.js 20见 package.json 的engines字段。Linux 用户若报No usable sandbox!错误需要按 Chrome 官方文档启用系统级沙箱这是 README 中专门提示的常见坑。仓库自带测试套件覆盖各参数行为本地起 HTTP 服务并用真实截图的像素尺寸做断言见 test/。下一步建议先跑一遍 example.js 的示例对自己负责的站点做一次多分辨率截图。目标是响应式测试的话建议挑 3~4 个尺寸兼顾手机如 480x320与桌面如 1920x1080。若接入 CI注意合理设置timeout与delay避免用例偶发失败。仓库当前没有公开的 CHANGELOG 文件以上均为 9.0.0 版本的已实现能力后续规划以项目后续的发布说明为准。【免费下载链接】pageresCapture website screenshots项目地址: https://gitcode.com/gh_mirrors/pa/pageres创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考