{"id":13406712,"url":"https://github.com/sindresorhus/pageres","last_synced_at":"2025-05-13T18:04:34.940Z","repository":{"id":13923646,"uuid":"16623069","full_name":"sindresorhus/pageres","owner":"sindresorhus","description":"Capture website screenshots","archived":false,"fork":false,"pushed_at":"2025-02-05T12:15:39.000Z","size":8970,"stargazers_count":9713,"open_issues_count":25,"forks_count":739,"subscribers_count":171,"default_branch":"main","last_synced_at":"2025-05-06T17:13:10.881Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sindresorhus.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":"contributing.md","funding":null,"license":"license","code_of_conduct":"code-of-conduct.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"sindresorhus","open_collective":"sindresorhus","buy_me_a_coffee":"sindresorhus","custom":"https://sindresorhus.com/donate"}},"created_at":"2014-02-07T18:15:18.000Z","updated_at":"2025-05-03T00:09:58.000Z","dependencies_parsed_at":"2023-11-11T11:03:25.008Z","dependency_job_id":"9bd379af-20dd-4cea-aafc-d8cc3141afee","html_url":"https://github.com/sindresorhus/pageres","commit_stats":{"total_commits":374,"total_committers":34,"mean_commits":11.0,"dds":"0.35026737967914434","last_synced_commit":"757a02f18e595cb2c337057a2ecc1e665948aff7"},"previous_names":[],"tags_count":51,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fpageres","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fpageres/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fpageres/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fpageres/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sindresorhus","download_url":"https://codeload.github.com/sindresorhus/pageres/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252874105,"owners_count":21817757,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-30T19:02:37.259Z","updated_at":"2025-05-13T18:04:34.640Z","avatar_url":"https://github.com/sindresorhus.png","language":"TypeScript","readme":"# ![pageres](media/promo.png)\n\n[![Coverage Status](https://codecov.io/gh/sindresorhus/pageres/branch/main/graph/badge.svg)](https://codecov.io/gh/sindresorhus/pageres)\n[![XO code style](https://img.shields.io/badge/code_style-XO-5ed9c7.svg)](https://github.com/xojs/xo)\n\nCapture screenshots of websites in various resolutions. A good way to make sure your websites are responsive. It's speedy and generates 100 screenshots from 10 different websites in just over a minute. It can also be used to render SVG images.\n\n*See [pageres-cli](https://github.com/sindresorhus/pageres-cli) for the command-line tool.*\n\n## Install\n\n```sh\nnpm install pageres\n```\n\nNote to Linux users: If you get a \"No usable sandbox!\" error, you need to enable [system sandboxing](https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md#setting-up-chrome-linux-sandbox).\n\n## Usage\n\n```js\nimport Pageres from 'pageres';\n\nawait new Pageres({delay: 2})\n\t.source('https://github.com/sindresorhus/pageres', ['480x320', '1024x768'], {crop: true})\n\t.source('https://sindresorhus.com', ['1280x1024', '1920x1080'])\n\t.source('data:text/html,\u003ch1\u003eAwesome!\u003c/h1\u003e', ['1024x768'])\n\t.destination('screenshots')\n\t.run();\n\nconsole.log('Finished generating screenshots!');\n```\n\n## API\n\n### Pageres(options?)\n\n#### options\n\nType: `object`\n\n##### delay\n\nType: `number` *(Seconds)*\\\nDefault: `0`\n\nDelay capturing the screenshot.\n\nUseful when the site does things after load that you want to capture.\n\n##### timeout\n\nType: `number` *(Seconds)*\\\nDefault: `60`\n\nNumber of seconds after which the request is aborted.\n\n##### crop\n\nType: `boolean`\\\nDefault: `false`\n\nCrop to the set height.\n\n##### css\n\nType: `string`\n\nApply custom CSS to the webpage. Specify some CSS or the path to a CSS file.\n\n##### script\n\nType: `string`\n\nApply custom JavaScript to the webpage. Specify some JavaScript or the path to a file.\n\n##### cookies\n\nType: `Array\u003cstring | object\u003e`\n\nA string with the same format as a [browser cookie](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies) or [an object](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagesetcookiecookies).\n\nTip: Go to the website you want a cookie for and [copy-paste it from DevTools](https://stackoverflow.com/a/24961735/64949).\n\n##### filename\n\nType: `string`\\\nDefault: `'\u003c%= url %\u003e-\u003c%= size %\u003e\u003c%= crop %\u003e'`\n\nDefine a customized filename using [Lo-Dash templates](https://lodash.com/docs#template).\\\nFor example: `\u003c%= date %\u003e - \u003c%= url %\u003e-\u003c%= size %\u003e\u003c%= crop %\u003e`.\n\nAvailable variables:\n\n- `url`: The URL in [slugified](https://github.com/sindresorhus/filenamify-url) form, eg. `http://yeoman.io/blog/` becomes `yeoman.io!blog`\n- `size`: Specified size, eg. `1024x1000`\n- `width`: Width of the specified size, eg. `1024`\n- `height`: Height of the specified size, eg. `1000`\n- `crop`: Outputs `-cropped` when the crop option is true\n- `date`: The current date (YYYY-MM-DD), eg. 2015-05-18\n- `time`: The current time (HH-mm-ss), eg. 21-15-11\n\n##### incrementalName\n\nType: `boolean`\\\nDefault: `false`\n\nWhen a file exists, append an incremental number.\n\n##### selector\n\nType: `string`\n\nCapture a specific DOM element matching a CSS selector.\n\n##### hide\n\nType: `string[]`\n\nHide an array of DOM elements matching CSS selectors.\n\n##### username\n\nType: `string`\n\nUsername for authenticating with HTTP auth.\n\n##### password\n\nType: `string`\n\nPassword for authenticating with HTTP auth.\n\n##### scale\n\nType: `number`\\\nDefault: `1`\n\nScale webpage `n` times.\n\n##### format\n\nType: `string`\\\nDefault: `png`\\\nValues: `'png' | 'jpg'`\n\nImage format.\n\n##### userAgent\n\nType: `string`\n\nCustom user agent.\n\n##### headers\n\nType: `object`\n\nCustom HTTP request headers.\n\n##### transparent\n\nType: `boolean`\\\nDefault: `false`\n\nSet background color to `transparent` instead of `white` if no background is set.\n\n##### darkMode\n\nType: `boolean`\\\nDefault: `false`\n\nEmulate preference of dark color scheme.\n\n##### launchOptions\n\nType: `object`\\\nDefault: `{}`\n\nOptions passed to [`puppeteer.launch()`](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#puppeteerlaunchoptions).\n\n##### beforeScreenshot\n\nType: `Function`\n\nThe specified function is called right before the screenshot is captured, as well as before any bounding rectangle is calculated as part of `options.element`. It receives the Puppeteer [`Page` instance](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#class-page) as the first argument and the [`browser` instance](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#class-browser) as the second argument. This gives you a lot of power to do custom stuff. The function can be async.\n\nNote: Make sure to not call `page.close()` or `browser.close()`.\n\n```js\nimport Pageres from 'pageres';\n\nawait new Pageres({\n\tdelay: 2,\n\tbeforeScreenshot: async (page, browser) =\u003e {\n\t\tawait checkSomething();\n\t\tawait page.click('#activate-button');\n\t\tawait page.waitForSelector('.finished');\n\t}\n})\n\t.source('https://github.com/sindresorhus/pageres', ['480x320', '1024x768', 'iphone 5s'], {crop: true})\n\t.destination('screenshots')\n\t.run();\n\nconsole.log('Finished generating screenshots!');\n```\n\n### pageres.source(url, sizes, options?)\n\nAdd a page to screenshot.\n\n#### url\n\n*Required*\\\nType: `string`\n\nURL or local path to the website you want to screenshot. You can also use a data URI.\n\n#### sizes\n\n*Required*\\\nType: `string[]`\n\nUse a `\u003cwidth\u003ex\u003cheight\u003e` notation or a keyword.\n\nA keyword is a version of a device from [this list](https://github.com/kevva/viewport-list/blob/master/data.json).\n\nYou can also pass in the `w3counter` keyword to use the ten most popular resolutions from [w3counter](http://www.w3counter.com/globalstats.php).\n\n#### options\n\nType: `object`\n\nOptions set here will take precedence over the ones set in the constructor.\n\n### pageres.destination(directory)\n\nSet the destination directory.\n\n#### directory\n\nType: `string`\n\n### pageres.run()\n\nRun pageres.\n\nReturns `Promise\u003cUint8Array[]\u003e`.\n\n## Task runners\n\nCheck out [grunt-pageres](https://github.com/sindresorhus/grunt-pageres) if you're using Grunt.\n\nFor Gulp and Broccoli, just use the API directly. No need for a wrapper plugin.\n\n## Built with Pageres\n\n- [Break Shot](https://github.com/victorferraz/break-shot) - Desktop app for capturing screenshots of responsive websites.\n\n## Related\n\n- [capture-website](https://github.com/sindresorhus/capture-website) - A different take on screenshotting websites\n","funding_links":["https://github.com/sponsors/sindresorhus","https://opencollective.com/sindresorhus","https://buymeacoffee.com/sindresorhus","https://sindresorhus.com/donate"],"categories":["TypeScript","Packages","JavaScript","Clear description","Repository","包","Command-line apps","目录","others","Tools","Uncategorized","Command line Tools","Examples","Linux","\\*nix/\\*nux"],"sub_categories":["Command-line apps","Automation \u0026 RPA","命令行程序","命令行应用","React Components","Uncategorized","Tools","World Wide Web"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsindresorhus%2Fpageres","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsindresorhus%2Fpageres","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsindresorhus%2Fpageres/lists"}