Pimp your Pipeline with Lighthouse CI

How to get Lighthouse into your release process

Enter, Lighthouse CI!

What are we working with?

Let’s do this!

npm install -D @lhci/cli
lighthouse/config.json
lighthouse/pre-collect.js
"scripts": {
"lh:collect": "lhci collect --config ./lighthouse/config.json"
...
}
npm run lh:collect

Asserting the results

lighthouse/config.json
"scripts": {
"lh:assert": "lhci assert --config ./lighthouse/config.json"
...
}
npm run lh:assert

Uploading the results

lhci wizard
lighthouse/config.json
"scripts": {
"lh:upload": "lhci upload --config ./lighthouse/config.json"
...
}
npm run lh:upload

Lastly, the YAML pipeline

LHCI_BUILD_CONTEXT__CURRENT_BRANCH: '$(Build.SourceBranch)'
- checkout: 'self'
fetchDepth: 1
azure-pipelines.yml

Conclusion

Web developer who’s worked in the industry long enough to remember Dreamweaver and Flash. Big fan of all things JavaScript. Enjoys music and dad jokes.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store