最常用且最可靠的方式是直接用process.env.node_env判断当前环境；它由vue cli/webpack根据命令自动设置（如serve→'development'、build→'production'），编译后固化为字符串，性能好无副作用，并支持配合.env文件中以vue_app_开头的变量实现灵活配置。

直接用 process.env.node_env 判断当前环境，是最常用也最可靠的方式。它在构建或启动时被注入，编译后就固化为字符串值，不依赖运行时动态读取，性能好、无副作用。

确认 NODE_ENV 的来源和默认行为

Vue CLI 和 Webpack 默认会根据命令自动设置 NODE_ENV：

• vue-cli-service serve → 自动启用 development 模式，process.env.NODE_ENV 为 "development"
• vue-cli-service build → 默认启用 production 模式，process.env.NODE_ENV 为 "production"
• 你也可以手动覆写，比如 vue-cli-service build --mode staging，此时 NODE_ENV 会取自 .env.staging 中定义的值（若未定义，则 fallback 为 "staging"）

在代码中做环境分支判断

所有逻辑分支都基于 process.env.NODE_ENV 字符串比较，注意加引号避免误判：

Stitch

Stitch是一款AI图像与设计工具，Google Labs 推出的 AI 原生设计工具。

下载

• 开发环境启用调试工具：
  if (process.env.NODE_ENV === 'development') { console.log('开启 Vue Devtools'); }
• 生产环境关闭敏感日志：
  if (process.env.NODE_ENV !== 'development') { axios.defaults.headers.common['X-Debug'] = undefined; }
• 不同环境加载不同 API 基地址：
  const API_BASE = process.env.NODE_ENV === 'production' ? 'https://api.example.com' : 'http://localhost:3000';

配合 .env 文件管理可变配置

仅靠 NODE_ENV 不够灵活，需搭配以 VUE_APP_ 开头的自定义变量：

• 在项目根目录创建 .env.development：
  VUE_APP_API_URL=http://localhost:8080/api
VUE_APP_FEATURE_FLAG=true
• 创建 .env.production：
  VUE_APP_API_URL=https://prod-api.example.com
VUE_APP_FEATURE_FLAG=false
• 这些变量会被 Webpack 静态替换，组件中直接使用：
  fetch(process.env.VUE_APP_API_URL + '/user')
• 注意：NODE_ENV、BASE_URL 和 VUE_APP_* 是唯三能进前端代码的变量，其他如 DB_PASSWORD 不会被打包

确保跨平台命令兼容性

在 package.json 的 scripts 中设置环境变量时，Windows 和 macOS/Linux 语法不同，必须用 cross-env 统一处理：

• 安装：npm install cross-env --save-dev
• 配置脚本：
  "scripts": { "build:prod": "cross-env NODE_ENV=production vue-cli-service build", "build:test": "cross-env NODE_ENV=staging vue-cli-service build --mode staging" }
• 这样无论在哪种系统执行，都能正确注入 NODE_ENV，避免本地 Windows 构建失败