js process对象解惑

问题描述

• 项目中环境隔离是避免不了的
• 因此经常会在项目入口文件中看到一些环境隔离的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中访问到

---

• npm脚本的使用：http://www.ruanyifeng.com/blog/2016/10/npm_scripts.html