{"id":15375664,"url":"https://github.com/addyosmani/webpack-lighthouse-plugin","last_synced_at":"2025-04-05T17:07:07.215Z","repository":{"id":12963976,"uuid":"72964554","full_name":"addyosmani/webpack-lighthouse-plugin","owner":"addyosmani","description":"A Webpack plugin for Lighthouse","archived":false,"fork":false,"pushed_at":"2023-04-17T16:06:34.000Z","size":981,"stargazers_count":292,"open_issues_count":14,"forks_count":12,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-03-29T16:07:00.649Z","etag":null,"topics":["lighthouse","lighthouse-audits","performance","webpack"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/addyosmani.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"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}},"created_at":"2016-11-06T02:01:38.000Z","updated_at":"2025-02-20T09:50:36.000Z","dependencies_parsed_at":"2024-06-19T02:52:12.416Z","dependency_job_id":"a8c9569b-7603-40da-b588-ce95b3337d43","html_url":"https://github.com/addyosmani/webpack-lighthouse-plugin","commit_stats":{"total_commits":47,"total_committers":4,"mean_commits":11.75,"dds":0.3829787234042553,"last_synced_commit":"0f8429d62eb8d5d67c131dc4d20a158b3d0cc2ca"},"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/addyosmani%2Fwebpack-lighthouse-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/addyosmani%2Fwebpack-lighthouse-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/addyosmani%2Fwebpack-lighthouse-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/addyosmani%2Fwebpack-lighthouse-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/addyosmani","download_url":"https://codeload.github.com/addyosmani/webpack-lighthouse-plugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247369952,"owners_count":20927928,"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":["lighthouse","lighthouse-audits","performance","webpack"],"created_at":"2024-10-01T14:04:26.089Z","updated_at":"2025-04-05T17:07:07.193Z","avatar_url":"https://github.com/addyosmani.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![npm version](https://badge.fury.io/js/webpack-lighthouse-plugin.svg)](https://badge.fury.io/js/webpack-lighthouse-plugin)\n[![npm](https://img.shields.io/npm/dm/webpack-lighthouse-plugin.svg)]()\n# Webpack Lighthouse Plugin\n\nThis plugin allows you to run [Lighthouse](https://github.com/googlechrome/lighthouse) from a Webpack build.\n\n## Installation\n\n`npm install --save-dev webpack-lighthouse-plugin`\n\n## Setup\n\nIn `webpack.config.js`:\n\n```js\nconst WebpackLighthousePlugin = require('webpack-lighthouse-plugin');\n\nmodule.exports = {\n  ...\n  plugins: [\n    new WebpackLighthousePlugin({\n      url: 'http://localhost:9001'\n    })\n  ],\n  ...\n}\n```\n\n## Example\n\nInsert into your webpack.config.js:\n\n```js\nconst WebpackLighthousePlugin = require('webpack-lighthouse-plugin');\n\nmodule.exports = {\n  entry: 'sample.js',\n  output: {\n    filename: 'test.js'\n  },\n  plugins: [\n    new WebpackLighthousePlugin({\n      url: 'https://airhorner.com'\n    })\n  ],\n};\n```\n\n\n### API\n* `url` - the URL to run Lighthouse audits against\n* `perf` - only report Lighthouse performance audits (instead of the full Progressive Web App audits)\n* `disableDeviceEmulation` - disables device emulation (`false` by default)\n* `disableCPUThrottling` - disables cpu throttling (`true` by default)\n* `disableNetworkThrottling` - disables network throttling (`false` by default)\n* `saveAssets` - save the trace contents \u0026 screenshots to disk   \n* `saveArtifacts` - save all gathered artifacts to disk \n\n#### Examples\n\n#### Performance metrics only\n\nJust get the time to first meaningful paint, time-to-interactive and perceptual speed-index:\n\n```js\nplugins: [\n  new WebpackLighthousePlugin({\n    url: 'https://airhorner.com',\n    perf: true\n  })\n],\n```\n\n### Test with CPU, network throttling and device emulation\n\n```js\nplugins: [\n  new WebpackLighthousePlugin({\n    url: 'https://airhorner.com',\n    disableCPUThrottling: false\n  })\n],\n```\n\n#### Save build assets (screenshots, trace and report):\n\n```js\nplugins: [\n  new WebpackLighthousePlugin({\n    url: 'https://airhorner.com',\n    saveAssets: true\n    })\n],\n```\n\nIf you require even more data, you can also pass `saveArtifacts: true`.\n\n### Running `webpack-lighthouse-plugin` with real mobile devices\n\nSimilar to the Lighthouse module, this plugin can also be used with real phones. It works over [remote debugging](https://github.com/GoogleChrome/lighthouse#lighthouse-w-mobile-devices)\nusing the [Android command line tools](http://developer.android.com/sdk/index.html#download).\n\nBefore running the plugin as part of your Webpack build, run the following commands:\n\n```\n$ adb kill-server\n$ adb devices -l\n$ adb forward tcp:9222 localabstract:chrome_devtools_remote\n``` \n\nYou can then run `webpack` against your build and instead of firing up a Chrome instance on desktop, it'll do this with\nyour mobile device Chrome instead. You will want to disable a few flags to improve the accuracy of your metrics:\n\n```js\nplugins: [\n  new WebpackLighthousePlugin({\n    url: 'https://localhost:9000', // Port you are locally serving on\n    disableDeviceEmulation: true,\n    disableCPUThrottling: true,\n    disableNetworkThrottling: true // Only if you're going to use real 3G\n  })\n],\n```\n\n### Webpack Dev Server\n\n*Note: Webpack Dev Server targets development builds rather than production. Although\nyou can run Lighthouse against a dev build, it's best run against builds closer to prod.*\n\nIf you're trying to use [webpack-dev-server](https://webpack.js.org/configuration/dev-server/) with\nthis plugin, first run it against your local build using the `webpack-dev-server` CLI:\n\n```js\n$ webpack-dev-server build/\n  http://localhost:8080/webpack-dev-server/\n ```\n\nThen make sure to reference the `webpack-dev-server` URL in your `WebpackLighthousePlugin` config:\n\n ```js\nplugins: [\n  new WebpackLighthousePlugin({\n    url: 'http://localhost:8080/webpack-dev-server/'\n  })\n],\n ```\n\n### Developing\n\nIf opening a pull request, create an issue describing a fix or feature. Have your pull request point to \nthe issue by writing your commits with the issue number in the message.\n\nMake sure you lint your code by running `npm run lint` and you can build the library by running \n`npm run build`.\n\n### License\n\nReleased under an Apache-2.0 license.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faddyosmani%2Fwebpack-lighthouse-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faddyosmani%2Fwebpack-lighthouse-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faddyosmani%2Fwebpack-lighthouse-plugin/lists"}