This is the code extracted from the lighthouse original repository and packaged as an ES Modules for convenience and tree shaking.
The code for this repository is automatically generated every time is built, copying the files, adding the imports
and exports
for every file.
This is only for convenience, and it would be cool if some day the people from Lighthouse could export this code as well.
- Install it using
npm i lighthouse-viewer
- In your code, import the following modules:
import { renderReport } from 'lighthouse-viewer';
import report from './static/report.json';
const app = document.querySelector<HTMLDivElement>('#lighthouse-viewer-element')!;
const reportHtml = renderReport(report as any, {});
app.appendChild(reportHtml);
- And in your HTML
<div>
<main class="lighthouse-viewer"></main>
</div>
If there is any issue with the license or the copyrights, please let me know. There is no other intentions behind this besides making it easy to find.