前言
oe-lighthouse 是一款基于 Lighthouse 的性能评估工具。在现代 Web 应用中，性能是至关重要的一环。评估并优化 Web 应用的性能，可以大大提高用户体验，因此掌握 oe-lighthouse 使用方法，是每个前端工程师必备的技能之一。
安装
首先，我们需要在项目根目录下使用 npm 安装 oe-lighthouse。
npm install oe-lighthouse --save-dev
使用
oe-lighthouse 的高级使用方法非常多，但我们可以先掌握其基础用法，熟练掌握基础用法之后再深入学习其高级用法。
基础用法
在 package.json 文件中，我们可以添加如下 npm script。
"scripts": {
"lighthouse": "node node_modules/oe-lighthouse/lighthouse.js --url=https://www.example.com"
}在命令行中运行以下命令即可使用 oe-lighthouse。
npm run lighthouse
oe-lighthouse 会根据传入的 URL 进行测试，并生成相应的测试报告。
测试报告
测试报告是我们评估和优化 Web 应用性能的重要工具。
oe-lighthouse 的测试报告如下图所示。
通过测试报告，我们可以看到 Web 应用的性能数据，包括页面加载速度、渲染速度、用户体验等等。这可以帮助我们快速定位 Web 应用中存在的性能问题，以便进一步优化和改进。
示例代码
以下是一个使用 oe-lighthouse 的示例代码。
"scripts": {
"lighthouse": "node node_modules/oe-lighthouse/lighthouse.js --url=https://www.example.com --chrome-flags=--headless --output=json --output-path=lighthouse-result.json",
"lighthouse-html": "node node_modules/oe-lighthouse/lighthouse.js --url=https://www.example.com --chrome-flags=--headless --output=json --output-path=lighthouse-result.json && node node_modules/oe-lighthouse/report-html.js lighthouse-result.json --output=lighthouse-result.html"
}在命令行中运行以下命令即可使用 oe-lighthouse。
npm run lighthouse
oe-lighthouse 将生成一份 JSON 测试报告，我们可以将这份报告用某个工具转换为 HTML 报告，以便更直观地查看测试结果。
例如，我们可以添加一个 "lighthouse-html" npm script，来将 JSON 报告转换为 HTML 报告。
在命令行中运行以下命令即可生成 HTML 报告。
npm run lighthouse-html
总结
oe-lighthouse 是一款重要的 Web 应用性能评估工具。掌握 oe-lighthouse 的基础用法，对于评估和优化 Web 应用的性能非常有帮助。当然，oe-lighthouse 的高级用法也同样重要，希望读者能够在今后的工作中不断深入学习 oe-lighthouse。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005694681e8991b448e4c69