前端工程项目的NODE_ENV

在搭建前端工程项目的时候，在package.json的scripts命令内容和webpack配置文件中可以看到NODE_ENV这个变量，它的值可以是development或product，也有人简写为'dev'或'prod'。

1.这个变量有什么用？

    顾名思义，这个变量表示构建项目的当前环境，也就是我们的程序会跑在生产环境、测试环境还是开发环境，在webpack配置中我们会根据不同环境作出不同的配置。

2.在哪里设置？

  我们知道，node中有全局变量process表示当前node进程，process.env包含着关于系统环境的信息。但是process.env中并不存在NODE_ENV这个东西。其实NODE_ENV只是一个用户自定义的变量，但是这个NODE_ENV变量语义非常恰当，并且在前端工程化配置中作为判断生产环境/开发环境的依据是非常自然而方便的事情，因而在前端工程化中逐渐成为一个事实规范。当我们在服务启动时配置NODE_ENV,或在代码中给process.env.NODE_ENV赋值，js便能通过process.env.NODE_ENV获取信息。

  那么，这个变量的赋值在哪里设置呢？很多开发者将NODE_ENV=XXXX放到项目package.json的scripts命令中：

"scripts": {
    "build-win": "SET NODE_ENV=production && webpack --config build/webpack.config.js",
    "build": "EXPORT  NODE_ENV=production && webpack --config build/webpack.config.js"
  }

 也有人会在webpack配置文件中对NODE_ENV作默认值处理，如果scripts.build||script.start脚本没有设置NODE_ENV,缺省值为'development'.

//...
NODE_ENV: process.env.NODE_ENV || 'development',
//...

3.不同平台下的设置区别？

  在类unix系统和安装并使用了bash的windows的系统上，我们会使用:

"EXPORT  NODE_ENV=production && webpack --config build/webpack.config.js"

  在windows系统上，我们使用：

"SET NODE_ENV=production && webpack --config build/webpack.config.js"

有的人嫌麻烦，为了屏蔽两种系统间的这个区别，会引用第三方插件cross-env

{
  "scripts": {
    "build": "cross-env NODE_ENV=production webpack --config build/webpack.config.js"
  }
}

  只要在NODE_ENV前面加上cross-env标志，会根据当前系统类型帮你选择适当的指令给NODE_ENV赋值。

 

--------------------- 

本文章为转载文章
原文：https://blog.csdn.net/weixin_36094484/article/details/80255199