Next.js项目用cypress-graphql-mock测试报cy.mockGraphql is not a function

核心原因是cypress-graphql-mock提供的命令没有正确注册到Cypress全局上下文，可按照以下步骤逐一排查修复：

• 第一步：在对应Cypress支持文件中引入依赖
  Cypress 10+版本：E2E测试对应cypress/support/e2e.js，组件测试对应cypress/support/component.js
  Cypress 9及更低版本：对应cypress/support/index.js
  在上述对应文件中添加引入代码：

  import 'cypress-graphql-mock';
  

• 第二步：校验Cypress配置的支持文件路径
  打开cypress.config.js（Cypress 10+）或cypress.json（旧版本），确认supportFile配置项的路径和你添加引入的文件路径一致，没有被自定义覆盖。
• 第三步：TypeScript项目额外补充类型声明
  在cypress/support/index.d.ts文件中添加类型引用，避免类型报错同时保障命令识别：

  /// <reference types="cypress-graphql-mock" />
  

• 第四步：解决高版本Cypress兼容问题
  cypress-graphql-mock目前最高仅支持Cypress 9.x版本，如果你使用的是Cypress 10及以上版本，会存在原生兼容问题，可选择两种方案处理：
  • 降级Cypress到9.x版本
  • 改用Cypress原生cy.intercept方法直接拦截GraphQL请求，参考实现：

    cy.intercept('POST', '/你的graphql接口路径', (req) => {
      // 匹配指定操作名的请求
      if (req.body.operationName === '你要模拟的Query/Mutation名称') {
        req.reply({
          data: {
            // 自定义返回的模拟数据
          }
        })
      }
    })
    

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