使用 cypress 生成灯塔 html 报告答案

【问题标题】：Generating lighthouse html report using cypress使用 cypress 生成灯塔 html 报告
【发布时间】：2021-10-16 01:50:32
【问题描述】：

我正在尝试以 html 格式生成灯塔报告。但是，我做不到。我收到以下错误：-

Cannot find module 'lighthouse/lighthouse-core/report/report-generator'

我使用以下链接为我的灯塔测试进行配置：-

https://atomfrede.gitlab.io/2021/04/automated-frontend-perfomance-test-with-lighthouse-for-jhipster/

不确定，实际上是什么错误，我一次又一次地尝试安装灯塔。尽管如此，还是没有运气。

npm install --save-dev lighthouse

谁能帮帮我？

下面是我试过的代码sn-p：-

const { lighthouse, pa11y, prepareAudit } = require('cypress-audit');
const fs = require('fs');
const ReportGenerator = require('lighthouse/lighthouse-core/report/report-generator');

module.exports = (on, config) => {
  on('before:browser:launch', (browser, launchOptions) => {

    prepareAudit(launchOptions);
    if (browser.name === 'chrome' && browser.isHeadless) {
      launchOptions.args.push('--disable-gpu');
      return launchOptions;
    }
  });

  on('task', {
    lighthouse: lighthouse((lighthouseReport) => {
      fs.writeFileSync('build/cypress/lhreport.html', 
         ReportGenerator.generateReport(lighthouseReport.lhr, 'html'));
    }),
    pa11y: pa11y(),
  });
};

【问题讨论】：

即使我也面临同样的问题，谁能帮我解决这个问题？

标签： html cypress lighthouse

【解决方案1】：

我有同样的问题。我跟着报告生成器的路径，注意到"lighthouse-core" 不在路径中。这对我有用：

const ReportGenerator = require('lighthouse/report/generator/report-generator');

【讨论】：

没有解决问题。

【解决方案2】：

乍一看，您似乎错过了安装灯塔的步骤

来自npm - Lighthouse

安装：

npm install -g lighthouse
# or use yarn:
# yarn global add lighthouse

所以上面是 global 安装命令 - 但您使用的是 local 安装。

不确定是否需要 global，或者为什么，但这是给出的指令。

【讨论】：

我在全球范围内安装了它，但仍然没有解决问题。我可以看到与上面相同的错误。