一些关于环境变量的总结

做的项目多了，就接触到很多种process.env的设置方式，有时候难免会有些迷糊，这里做些总结

准备工作

环境变量是一些我们不想在代码里处理的变量，它可以让我们写的代码与它所运行的环境联系起来。我们工作中常常都会用到环境变量，但是很多时候我们用的并不是那么的得心应手，特别是在它的作用域问题上。

最常见的环境变量的设置是在.bash_profile文件中export出来

export AWS_SECRET_ACCESS_KEY=foo
export AWS_ACCESS_KEY_ID=bar

然后在node程序（其他的程序中有自己的获取方式）中你就可以直接使用了

var secretAccessKey = process.env.AWS_SECRET_ACCESS_KEY;
var accessKeyId = process.env.AWS_ACCESS_KEY_ID;

这种方式最大的缺点就是如果有两个程序，需要不同的accessKeyId和secretAccessKey，这样我们就得修改变量的名字，比如加上前缀proA_accessKeyId等，如果有三个甚至更多呢，这样的处理方式就肯定不是我们想要的了

最理想的就是每个程序有自己的环境变量配置，下面我们看下在node、npm、webpack中如何使用环境变量

1. node中使用环境变量

我们常见的方式是这种方式

NODE_ENV=production node index.js

这种方式最大的问题就是变量一多，写起来有点长，也不便于维护。所以如果你写node程序的话，你可能需要dotenv，他通过项目根目录的.env文件来维护环境变量

DB_HOST=localhost
DB_USER=root
DB_PASS=s1mpl3

然后就能这样使用了

require('dotenv').config()
var db = require('db')
db.connect({
  host: process.env.DB_HOST,
  username: process.env.DB_USER,
  password: process.env.DB_PASS
})

dotenv还支持preload功能。就是你不想在代码里留下这句require('dotenv').config()，毕竟这对有洁癖的人来说还是难以忍受的，你可以使用 node的--require (-r)选项

node -r dotenv/config your_script.js

当然webpack的工程中也可以使用dotenv，只不过是有时候webpack.DefinePlugin基本就够用了

2. npm中使用环境变量

npm对于环境变量的使用最多的应该是在package.json的scripts模块中

package.json文件中的变量

package.json vars
The package.json fields are tacked onto the npm_package_ prefix. So, for instance, if you had {"name":"foo", "version":"1.2.5"} in your package.json file, then your package scripts would have the npm_package_name environment variable set to "foo", and the npm_package_version set to "1.2.5"

上面这段是官方文档中摘下来的，就是告诉我们package.json文件中的key值都会被设置成以npm_package_为前缀的环境变量，比如如果你的package.json文件中有这么一段{"name":"foo", "version":"1.2.5"} ，那么你在package scripts 中就可以使用$npm_package_name变量了，它的值就是foo，自然你也可以在js代码中使用process.env.npm_package_name获取到它的值

不过现在都是开源时代，谁还看文档啊，直接看源码就好了

有个例外，如果是config模块的值还会被设置成以npm_config_前缀的环境变量，使用上和上面一致

当然如果我们只需要在js代码中使用package中的信息，还是通过require的方式获取显得更加方便

const package = require('./package.json')
console.log(package.version)

package.json文件中scripts模块的环境变量
我们对已有的环境变量可以$xxx和${xxx}这两种方式使用

{
  scripts:{
    "argv": "echo $npm_package_version",    
    "argv": "echo ${npm_package_version}",  
  }
}

我们还可以设置环境变量，我们常看到的就是这样了

// NODE_ENV就是我们设置的环境变量，通过process.env.NODE_ENV就可以使用了
{
  scripts:{
    "build": "NODE_ENV=production webpack --config config/webpack/production.config.js"
  }
}

当然这其实都是bash和node的知识范畴

3. webpack中使用环境变量

上面node和npm设置的环境变量在webpack中都可以使用，而webpack中我们还可以看到一种定义方式，就是通过DefinePlugin来定义

  new webpack.DefinePlugin({
    'process.env': {
      NODE_ENV: "production"
    },
    PRODUCTION: JSON.stringify(true),
    RELEASE: JSON.stringify(process.env.RELEASE)
  })

这种定义方式本质上有点类似 process.env.NODE_ENV = "production"这种js代码直接赋值的方式，为什么类似呢，因为它还是有区别的，区别就是在build出来的代码上你可以看待到process.env.NODE_ENV会直接被production字符串替换（注意：并不是简单的直接替换，它是根据AST来替换的）。因为并非真正的设置到了环境变量中，所以我们不能把需要环境变量的地方依赖于它，否则不会有效果

4.总结

其实这里的应该都是属于node中的环境变量，毕竟npm和webpack都是用node跑的，所以node的环境变量的设置方式对三者都有效，只是npm和webpack有些是自己封装过的设置方式，其设置只对自己有效罢了