Как настроить @cypress/code-coverage для Angular и TypeScript

В документации Cypress для @cypress/code-coverage сказано, что нужно использовать этот код...

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

...и...

// 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. Единственный экспорт из плагина — это функция с именем 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 становится...

// 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;
    },
  },
})

Это вызывает ошибку конфигурации.

Что я делаю не так?

🤔 А знаете ли вы, что...
Для создания пользовательских интерфейсов в Angular используется декларативный язык шаблонов.