云函数中如何区分开发与生产环境以配置BASE_URL？

1. Node.js/后端项目 #

直接利用行业通用的NODE_ENV环境变量判断：

• 开发环境启动时，将NODE_ENV设为development
• 生产部署时，将NODE_ENV设为production

代码实现：

const isProd = process.env.NODE_ENV === 'production';
const BASE_URL = isProd ? 'https://mydomain' : 'http://localhost:3000';

设置环境变量的方式：

• 开发启动命令：NODE_ENV=development node your-app.js（Windows系统用set NODE_ENV=development && node your-app.js）
• 生产部署时，通过服务器配置（如Nginx、PM2）或部署脚本统一设置NODE_ENV=production

2. React项目（Create React App） #

Create React App会自动注入process.env.NODE_ENV变量：

• npm start开发时，变量值为development
• npm run build打包生产版本时，变量值自动设为production

直接使用判断逻辑：

const isProd = process.env.NODE_ENV === 'production';
const BASE_URL = isProd ? 'https://mydomain' : 'http://localhost:3000';

3. Vue项目（Vue CLI） #

Vue CLI支持通过.env系列文件管理环境配置：

• 根目录创建.env.development：

  VUE_APP_BASE_URL=http://localhost:3000
  

• 创建.env.production：

  VUE_APP_BASE_URL=https://mydomain
  

• 代码中直接读取变量，无需手动判断：

  const BASE_URL = process.env.VUE_APP_BASE_URL;
  

若需手动判断环境，也可使用process.env.NODE_ENV，开发时为development，生产打包时为production。

4. 纯前端静态页面 #

无构建工具的静态页面，可通过当前页面域名判断：

const isProd = window.location.hostname !== 'localhost' && window.location.hostname !== '127.0.0.1';
const BASE_URL = isProd ? 'https://mydomain' : 'http://localhost:3000';

注意：若存在测试环境域名，需在判断条件中添加对应排除项。

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