如何使用process.env环境变量覆盖Cypress.config().baseUrl配置

两个核心原因导致该报错：

• 你传入cy.visit()的process.env.MYAPPURL实际为undefined，不符合方法的参数要求
• Cypress测试用例运行在浏览器环境，不存在Node.js专属的process全局对象，同时Cypress默认不会自动加载项目根目录下.env文件的变量到自身运行环境中

步骤1：安装dotenv依赖 #

用于加载本地.env文件的变量，执行以下命令安装：

npm install dotenv --save-dev

确认你的.env文件存放在项目根目录，变量写法符合规范：

MYAPPURL=https://你的测试站点域名.com

步骤2：修改Cypress配置文件注入变量 #

如果你使用Cypress 10及以上版本 #

修改项目根目录下的cypress.config.js：

const { defineConfig } = require("cypress");
// 加载根目录.env文件变量
require('dotenv').config();

module.exports = defineConfig({
  e2e: {
    // 直接配置全局baseUrl，后续访问不需要重复写域名
    baseUrl: process.env.MYAPPURL,
    setupNodeEvents(on, config) {
      // 将.env变量注入到Cypress环境变量，供测试用例调用
      config.env.MYAPPURL = process.env.MYAPPURL
      return config
    },
  },
});

如果你使用Cypress 10以下旧版本 #

修改cypress/plugins/index.js：

require('dotenv').config()

module.exports = (on, config) => {
  // 配置全局baseUrl
  config.baseUrl = process.env.MYAPPURL
  // 注入环境变量
  config.env.MYAPPURL = process.env.MYAPPURL
  return config
}

步骤3：测试用例中正确调用 #

配置完成后有两种调用方式：

• 推荐直接用cy.visit('/')，Cypress会自动拼接你配置的baseUrl，不需要手动传入完整域名
• 如果需要单独获取变量，使用Cypress提供的Cypress.env()方法获取，不要直接调用process.env：

cy.visit(Cypress.env('MYAPPURL'))

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