js process對象解惑

問題描述

  • 項(xiàng)目中環(huán)境隔離是避免不了的
  • 因此經(jīng)常會在項(xiàng)目入口文件中看到一些環(huán)境隔離的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"
  },
  • 就有疑問:
    • 我是什么時(shí)候給process.env.NODE_ENV賦值了呢?
    • 在命令行中定義變量有什么用,如何傳遞到代碼中呢?
    • 是不是說我在代碼的任何一地方都能夠訪問到這個(gè)process對象并且任何訪問的地方數(shù)據(jù)都是一致的呢?

問題解答

  • Q1:process是什么對象有什么作用呢?
  • A1:process對象是一個(gè)Global全局對象,你可以在任何地方使用它,而無需require。

全局對象(模塊)

  • 在所有模塊中都能使用的對象
  • 作用域是全局的
    • 比如export也是在所有模塊中都能使用,但是作用域是當(dāng)前模塊

process對象

  • node.js中進(jìn)程相關(guān)的對象
  • 是全局對象,因此你可以在code中的任何一個(gè)地方訪問其對象中的屬性,值都是一致的
  • 其中包含一些和進(jìn)程以及nodejs運(yùn)行環(huán)境相關(guān)的一些屬性
    • process.env:返回用戶運(yùn)行環(huán)境對象
    • process.execArgv:返回Node的命令行參數(shù)數(shù)組
    • process.argv:一個(gè)當(dāng)前執(zhí)行進(jìn)程折參數(shù)組,第一個(gè)參數(shù)是node,第二個(gè)參數(shù)是當(dāng)前執(zhí)行的.js文件名,之后是執(zhí)行時(shí)設(shè)置的參數(shù)列表。
    • process.on():綁定事件
  - exit:進(jìn)程退出事件
  - uncaughtException:包含沒有捕獲異常的時(shí)間
- process.nextTick()以及process.exit()等方法

  • Q2:process.env是什么?如何設(shè)置?默認(rèn)值又是什么呢?
  • A2:是一個(gè)對象,包含關(guān)于環(huán)境變量的內(nèi)容。
    • 訪問當(dāng)前node.js的運(yùn)行環(huán)境:process.env.NODE_ENV
    • 修改當(dāng)前環(huán)境:通過命令行修改nodejs運(yùn)行環(huán)境
      • export NODE_ENV=test && node app.js
        • 在啟動服務(wù)中之前使用上個(gè)命令修改環(huán)境
    • 默認(rèn)的node.js運(yùn)行環(huán)境:
      • 當(dāng)你沒有設(shè)置NODE_ENV的值,其默認(rèn)值為undefined

  • Q3: 命令行如何傳參到代碼中?代碼中又是如何訪問到的呢?
  • A3:有很多傳參方式,配合node命令傳參,使用webpack傳參,使用npm傳參:
    • node:
      • 傳入:TEST=aa node app.js
      • 訪問:process.env.TEST
    • webpack命令傳參
      • 傳入:在webpack命令或者webpack-dev-server命令之后使用--env.**=**設(shè)置變量或者設(shè)置NODE_ENV的值

      • 訪問:只能在webpack.config.js中訪問,通過訪問export.module的回調(diào)函數(shù)傳入的參數(shù)env。在回調(diào)函數(shù)中使用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',
。。。
}
}
}
```
- 注意點(diǎn):
- 如果你的服務(wù)是通過webpack-dev-server啟動
- 如果直接在命令行中使用TEST=aa webpack-dev-server
- 那么就只能在webpack.config.js中的module.export回調(diào)函數(shù)中通過process.env.TEST訪問到傳入的值
- 而不能在code中訪問到


?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容