Angular+TypeScript环境下配置@cypress/code-coverage报错排查

按照@cypress/code-coverage的Cypress官方文档，需要做以下配置：

1. 在cypress/support/e2e.js中添加：

// cypress/support/e2e.js
import '@cypress/code-coverage/support'

2. 在cypress.config.ts中添加：

// cypress.config.ts
import { defineConfig } from 'cypress'

export default defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      require('@cypress/code-coverage/task')(on, config)
      return config
    },
  },
})

但在TypeScript环境中，cypress.config.ts里的require会触发错误，提示改用import。查看插件源码后发现，@cypress/code-coverage/task仅导出registerCodeCoverageTasks函数：

// @cypress/code-coverage/task.js
...

function registerCodeCoverageTasks(on, config) {
  on('task', tasks)

  // set a variable to let the hooks running in the browser
  // know that they can send coverage commands
  config.env.codeCoverageTasksRegistered = true

  return config
}

module.exports = registerCodeCoverageTasks

于是我把配置代码修改为：

// cypress.config.ts
import { defineConfig } from 'cypress';
import registerCodeCoverageTasks from '@cypress/code-coverage/task';

export default defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      registerCodeCoverageTasks(on, config);
      return config;
    },
  },
})

修改后却触发了配置错误：

请问我哪里操作有误？

内容的提问来源于stack exchange，提问作者Kirkland