Cypress中cypress.json与cypress.config.js配置文件的区别是什么？

• 版本适配不同
  cypress.json是Cypress 9及更早版本的默认配置文件，从Cypress 10开始，官方彻底弃用cypress.json作为默认配置，转而推荐使用cypress.config.js（或.ts），且Cypress 9及以下版本不支持cypress.config.js。

• 配置语法与灵活性差异

  • cypress.json采用纯JSON格式，只能定义静态键值对，无法编写任何逻辑代码，配置项的值必须是JSON支持的类型（字符串、数字、布尔、数组、对象）。
  • cypress.config.js是Node.js模块，支持用JavaScript/TypeScript编写，可实现动态配置：比如根据环境变量切换baseUrl、通过条件判断设置不同配置项、导入外部模块复用配置逻辑等。

  示例对比：
  cypress.json静态配置：

  {
    "baseUrl": "https://dev.example.com",
    "viewportWidth": 1280,
    "viewportHeight": 720
  }
  

  cypress.config.js动态配置：

  const { defineConfig } = require('cypress')
  
  module.exports = defineConfig({
    e2e: {
      baseUrl: process.env.NODE_ENV === 'prod' ? 'https://prod.example.com' : 'https://dev.example.com',
      viewportWidth: 1280,
      viewportHeight: 720
    }
  })
  

• 功能扩展性差异
  cypress.json仅能配置Cypress提供的基础选项（如超时时间、视图大小、测试文件路径等），无法触及Node.js层面的逻辑。而cypress.config.js支持通过setupNodeEvents钩子注册自定义任务（cy.task）、集成第三方插件、修改测试运行时的Node环境，实现更复杂的测试扩展。

  比如在cypress.config.js中注册自定义任务：

  module.exports = defineConfig({
    e2e: {
      setupNodeEvents(on, config) {
        on('task', {
          sayHello(name) {
            console.log(`Hello ${name}!`)
            return null
          }
        })
      }
    }
  })
  

• 配置加载方式不同
  cypress.json是Cypress直接读取的静态文件，加载过程无执行逻辑；cypress.config.js会被Node.js执行，支持异步加载配置（比如从远程接口读取配置、读取本地.env文件），配置可以是一个异步函数返回的对象。

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