NodeJs/Vue项目中对process.env的使用

最近系统接入了公司的单点登录，为了登陆成功后再跳回系统的主页面，又申请了测试和沙箱的域名（之前都是直接用IP登的），本地开发是配置的host。接入之后发现了一个非常麻烦的点就是给单点登录传的跳转地址每次都要修改，开发的时候要写成开发的域名，测试的时候要改成测试的域名，进沙箱的时候要改成跳转沙箱的域名，上线的时候又要改成线上的域名。特别是在测试阶段，开发测试来回切换，不胜其烦。
于是就想把它写成配置文件，根据不同环境加载不同的配置，这样就不用来回改了。这个时候，process.env就跳入了脑海，叫嚣着，终于该我出场啦！！

扒一扒process.env

process对象是全局变量，它提供当前node.js的有关信息，以及控制当前node.js的有关进程。因为是全局变量，它对于node应用程序是始终可用的，无需require()。
既然process都是一个对象了，env自然是它的一个属性，这个属性返回包含用户环境信息的对象。在终端输入node后，在输入process.env可以看到打印出来的信息。

主角出场 process.env.NODE_ENV

NODE_ENV不是process.env对象上原有的属性，它是我们自己添加上去的一个环境变量，用来确定当前所处的开发阶段。一般生产阶段设为production，开发阶段设为develop，然后在脚本中读取process.env.NODE_ENV。
运行脚本时，可以这样改变环境变量, 在package.json文件的scripts里面添加命令：

NODE_ENV=production node build.js

但是这个命令使用Windows的同学拉下代码后就报错了，因为Windows上面设置的方式不一样：

set NODE_ENV=production node build.js

但是不同电脑上不同的设置肯定是不行的呀，这个时候cross-env赶来救场了。
cross-env可以跨平台的设置和使用环境变量
安装：

npm install --save-dev cross-env

接下来我们就可以通过cross-env来设置了

cross-env NODE_ENV=production node build.js

这样设置之后，我们可以在脚本中使用process.env.NODE_ENV了，但是不能在模块中使用，要想在模块当中直接使用，我们还需要一些配置

DefinePlugin

DefinePlugin可以定义一些全局变量，让我们在模块当中直接使用，不用做任何声明。

const webpack = require('webpack');

module.exports = {
    entry: {
        app: './src/app'
    },
    output: {
        path: 'dist',
        filename: 'bundle.js'
    },
    plugins: [
        new webpack.DefinePlugin({
           'process.env.NODE_ENV':  'production'
        })
    ]
};

DefinePlugin直接将内容替换了，而不是一个字符串，所以我们经常这样定义：

new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
})

这样就可以直接使用啦_
现在我们要在模块中根据环境变量来配置不同的url了

let url = '';
 if (process.env.NODE_ENV === 'testing') {
   url = 'http://my.test';
 } else if (process.env.alpord === 'alpord') {
   url = 'http://my.alpord';
 } else if (process.env.NODE_ENV === 'production') {
   url = 'http://my.product';
 } else {
   url = 'http://my.develop';
 }

这只是简单列了一下process.env.NODE_ENV的用法，大家知道怎么用就好啦

作者：snow_in
链接：https://www.jianshu/p/c8f9c61c2f20
来源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。