如何正确设置 process.env.NODE_ENV 生产环境模式

首先需要明确：process.env.NODE_ENV 默认仅包含两种状态，即 development 和 production。其中，development 指代本地开发环境（如 localhost），而 production 代表发布到任何服务器上的应用状态（涵盖 DAT、UAT 及正式生产环境）。Node.js 本身无法自动识别服务是处于测试还是正式阶段，除非手动指定，否则通常默认视为线上环境。因此，可以理解为：development 对应本地开发，production 对应所有线上环境（包括测试、预发布和生产）。

之所以特别强调这一概念，

是因为在实际开发中，有人错误地使用 process.env.NODE_ENV 中的 development 来指代 DAT、UAT 等线上测试环境。这里必须澄清：development 仅代表本地开发环境，不应混淆。

近期系统接入了公司单点登录（SSO），为实现登录成功后跳转回系统主页，我们申请了测试和沙箱域名（此前直接使用 IP 访问）。本地开发通过配置 host 文件实现。接入后发现一个痛点：每次向单点登录传递跳转地址时均需手动修改域名。开发时需配置开发域名，测试时改为测试域名，沙箱时改为沙箱域名，上线时再改为线上域名。尤其在测试阶段，开发与环境频繁切换，手动修改极为繁琐。

因此，考虑将其配置为配置文件，根据不同环境加载相应配置，从而避免反复修改。此时，process.env 进入了视野。

process 对象是一个全局变量，提供当前 Node.js 的相关信息及进程控制能力。作为全局变量，它在 Node 应用程序中始终可用，无需通过 require() 引入。

既然 process 是一个对象，env 自然为其属性，返回包含用户环境信息的对象。在终端输入 node 后，输入 process.env 即可打印出相关信息。

核心变量 process.env.NODE_ENV

NODE_ENV 并非 process.env 对象原有的属性，它是如何被添加的呢？

首先举例说明：

在 package.json 文件中，配置如下：

{
  "name": "yun-nobile",
  "version": "2.0.0",
  "description": "太保标准移动端产品2.0，基于vue",
  "main": "yunprod.js",
  "scripts": {
    "build": "cross-env NODE_ENV=production node yunprod.js build",
    "dev": "node yunprod.js dev"
  }
  ...
}  

当我们执行 npm run build 脚本命令时，实际执行的是 cross-env NODE_ENV=production node yunprod.js build。该命令将 NODE_ENV 设置为 production，从而使 process.env.NODE_ENV 被赋值为 production。

由此可见，process.env.NODE_ENV 是在执行脚本命令时添加的全局环境变量。

process.env.NODE_ENV 用于确定当前所处的开发阶段。通常生产阶段设为 production，开发阶段设为 develop，随后在脚本中读取该变量。运行脚本时，可通过以下方式改变环境变量，即在 package.json 文件的 scripts 中添加命令：

NODE_ENV=production node build.js

然而，使用此命令的 Windows 用户拉取代码后可能会报错，因为 Windows 系统上设置环境变量的方式与 Linux/Mac 不同。

set NODE_ENV=production node build.js

不同操作系统设置方式不一致显然不可行，此时 cross-env 工具应运而生。cross-env 能够跨平台地设置和使用环境变量。

npm install --save-dev cross-env

接下来，我们可以利用 cross-env 进行配置：

cross-env NODE_ENV=production node build.js

经过上述设置，我们可以在脚本中使用 process.env.NODE_ENV。但若想在模块中直接使用该变量，还需进行额外配置。

在 Webpack 4 及以上版本中，可以使用 mode 选项：

module.exports = {
  mode: 'production'
}

而在 Webpack 3 及更低版本中，则需要使用 DefinePlugin：

var webpack = require('webpack')

module.exports = {
  // ...
  plugins: [
    // ...
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('production')
    })
  ]
}

完成上述配置后，即可直接使用。现在，我们需要在模块中根据环境变量配置不同的 URL。

let url = '';
 if (process.env.NODE_ENV === 'testing') {
   url = 'http://my.test.cn';
 } else if (process.env.alpord === 'alpord') {
   url = 'http://my.alpord.cn';
 } else if (process.env.NODE_ENV === 'production') {
   url = 'http://my.product.cn';
 } else {
   url = 'http://my.develop.cn';
 }

例如：

let url = '';
process.env.NODE_ENV === 'production'?url = 'http://my.product.cn':url = 'http://my.test.cn';

本文关于如何配置 process.env.NODE_ENV 以启用生产环境模式的教程至此结束。如需了解更多 process.env.NODE_ENV 在生产环境模式下的设置细节，敬请查阅本站往期文章或继续浏览下方相关条目。感谢大家持续支持本站！