使用
我正在使用灯塔为我们自己的一些网站创建性能报告。我还需要拍一张截图，看看这个网站在台式电脑上的样子。
Lighthouse似乎默认情况下会以移动分辨率拍摄屏幕截图。
我该怎么改？
如果可能的话，我尽量避免使用像Puppeteer这样的其他库。
这是一些运行灯塔的代码
import lighthouse from 'lighthouse';
import chromeLauncher from 'chrome-launcher';
const chrome = await chromeLauncher.launch({ chromeFlags: ['--headless'] });
const options = {
logLevel: 'info',
output: 'json',
onlyCategories: ['performance', 'accessibility', 'best-practices', 'seo'],
port: chrome.port
};
const runnerResult = await lighthouse(url, options);
Lighthouse返回审核的显示捕获：
screenshot-thumbnails-120px x 213pxfinal-screenshot-280像素x 498像素
我能买到比这个大的吗？
简介
您需要使用文档中列出的lighthouse CLI options，例如，请参阅github自述文件和node-npm文档。
有很多选择，但最有趣的选择是：
--screenEmulation注意：另请参阅
--preset选项，或使用--screenEmulation.disabled禁用。否则，您可以单独设置这4个参数：
--screenEmulation.mobile --screenEmulation.width=360 --screenEmulation.height=640 --screenEmulation.deviceScaleFactor=2
此外，请查看设备仿真/仿真用户代理，并特别使用以下参数：
lighthouse <url> --chrome-flags="--window-size=1024,768"
lighthouse <url> --screenEmulation.desktop--screenEmulation.width=1024 --screenEmulation.height=768 --screenEmulation.deviceScaleFactor=2
lighthouse <url> --screenEmulation.mobile --screenEmulation.width=1024 --screenEmulation.height=768 --screenEmulation.deviceScaleFactor=2
和
lighthouse <url> --preset=desktop
还可以查看位于以下位置的一些附加配置：https://github.com/GoogleChrome/lighthouse/tree/master/lighthouse-core/config
通过Nodejs
关于通过nodejs启动，我需要找到我的例子，但我确实从灯塔的文档中找到了这个例子。为了从nodejs运行灯塔+铬无头使用以下内容：
const lighthouse = require('lighthouse');
const chromeLauncher = require('chrome-launcher');
function launchChromeAndRunLighthouse(url, flags = {}, config = null) {
return chromeLauncher.launch(flags).then(chrome => {
flags.port = chrome.port;
return lighthouse(url, flags, config).then(results =>
chrome.kill().then(() => results));
});
}
const flags = {
chromeFlags: ['--headless']
};
launchChromeAndRunLighthouse('https://github.com', flags).then(results => {
// Use results!
});
PS：将很快更新更多信息
来源：
- https://github.com/GoogleChrome/lighthouse
- 节点npm文档
- https://github.com/GoogleChrome/lighthouse/blob/master/lighthouse-core/config/lr-desktop-config.js
使用full-page-screenshot审核
值得一提的是，在Lighthouse 7.5版中(不知道以前的版本是如何的(，全尺寸屏幕截图在名为full-page-screenshot的审计中。
考虑到这是一个"完整页面"的屏幕截图，所以它的整个网站从上到下(不仅在折叠内容上方可见(。
除此之外，@menelaos的回答描述了关于操作窗口大小和设备模拟的一切——你需要获得任何大小的屏幕截图。