问题描述

项目中环境隔离是避免不了的
因此经常会在项目入口文件中看到一些环境隔离的code

//index.js
const isProduction = process.env.NODE_ENV === 'production'

//package.json
"scripts": {
    "test": "cross-env BABEL_DISABLE_CACHE=1 NODE_ENV=test ava",
    "build": "webpack --config webpack.config.prod.js  --progress --colors",
    "start": "webpack-dev-server --config webpack.config.js --progress --inline  --colors --port 1337 --host 0.0.0.0",
    "start:mock": "TARGET=http://localhost:8080 npm start",
    "deploy": "cross-env NODE_ENV=production ./node_modules/.bin/webpack --config ./webpack.config.prod.js"
  },

就有疑问：
- 我是什么时候给process.env.NODE_ENV赋值了呢？
- 在命令行中定义变量有什么用，如何传递到代码中呢？
- 是不是说我在代码的任何一地方都能够访问到这个process对象并且任何访问的地方数据都是一致的呢？

问题解答

Q1:process是什么对象有什么作用呢？
A1:process对象是一个Global全局对象，你可以在任何地方使用它，而无需require。

全局对象（模块）

在所有模块中都能使用的对象

作用域是全局的

比如export也是在所有模块中都能使用，但是作用域是当前模块

process对象

node.js中进程相关的对象

是全局对象，因此你可以在code中的任何一个地方访问其对象中的属性，值都是一致的

其中包含一些和进程以及nodejs运行环境相关的一些属性

process.env:返回用户运行环境对象

process.execArgv:返回Node的命令行参数数组

process.argv:一个当前执行进程折参数组，第一个参数是node，第二个参数是当前执行的.js文件名，之后是执行时设置的参数列表。

process.on()：绑定事件

  - exit:进程退出事件
  - uncaughtException：包含没有捕获异常的时间
- process.nextTick()以及process.exit()等方法

Q2:process.env是什么？如何设置？默认值又是什么呢？
A2:是一个对象，包含关于环境变量的内容。
- 访问当前node.js的运行环境：process.env.NODE_ENV
- 修改当前环境：通过命令行修改nodejs运行环境
  - export NODE_ENV=test && node app.js
    - 在启动服务中之前使用上个命令修改环境
- 默认的node.js运行环境：
  - 当你没有设置NODE_ENV的值,其默认值为undefined

Q3: 命令行如何传参到代码中？代码中又是如何访问到的呢？
A3:有很多传参方式，配合node命令传参，使用webpack传参，使用npm传参：
- node：
  - 传入：TEST=aa node app.js
  - 访问：process.env.TEST
- webpack命令传参
  - 传入：在webpack命令或者webpack-dev-server命令之后使用--env.**=**设置变量或者设置NODE_ENV的值
  - 访问：只能在webpack.config.js中访问，通过访问export.module的回调函数传入的参数env。在回调函数中使用env.** 访问变量值
  - 资料：https://webpack.js.org/guides/environment-variables/
  - 例子:
```
//package.json
 "start": "webpack-dev-server --env.TEST=aaa --env.NODE_ENV=local --config webpack.config.js --progress --inline  --colors --port 1337 --host 0.0.0.0"
 //webpack.config.js
 module.exports = (env) => {
```

console.log(env.TEST) //aaa
console.log(env.NODE_ENV) //local
return {
devtool: 'inline-source-map',
entry: {
vendor: [
'react',
'react-dom',
。。。
}
}
}
```
- 注意点：
- 如果你的服务是通过webpack-dev-server启动
- 如果直接在命令行中使用TEST=aa webpack-dev-server
- 那么就只能在webpack.config.js中的module.export回调函数中通过process.env.TEST访问到传入的值
- 而不能在code中访问到