问题描述
- 项目中环境隔离是避免不了的
- 因此经常会在项目入口文件中看到一些环境隔离的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
- 在启动服务中之前使用上个命令修改环境
- 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.** 访问变量值
-
例子:
//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) => {
- node：
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中访问到
