趁着新春开年研究了一些小问题，小的菜鸟一枚，如有错误请指教，大牛请绕道。
用vue脚手架搭建出的项目帮我们省去了非常多的功夫，大大的增加了前端人员的寿命，但是如果只是会用的话我觉得还是欠缺很多的，所以我这里列出几点我刚算弄明白的一些问题，以免以后有懵逼。
项目中的环境变量process对象
用过vue脚手架开发项目的伙伴们应该多少见过一个东东 process.env
我们先来说下process是啥，他是node中的一个全局对象 官方解释: process 对象是一个 global （全局变量），提供有关信息，控制当前 Node.js 进程。顾名思义，这个对象保存着项目运行中的所有环境信息，有兴趣的伙伴可以在运行过程中去打印看看里面的详细信息，这里我们不多做讨论，我们接着直奔主题。
process.env是什么？上面我们解释到process是node中的一个环境对象，env当然就是它的一个属性咯，env-顾名思义，就是environment(环境)，连一个四级都没过的我都知道，如果你不知道的话就去面壁吧。所以这个属性就是用来保存我们的环境变量了。知道这个后，我们再来看下一个问题 process.env.NODE_ENV是啥呢？请看下面
，图1
看到图一，脚手架搭建出来的项目中的config文件夹中有dev.env和prod.env这两个js，我们发现里面有定义一个叫NODE_ENV的参数，说到这里，我们心里大概就已经猜到了，process.env.NODE_ENV里面的NODE_ENV就是在这里来的。那么问题来了，这两个变量是什么时候被设置到process.env对象里面的呢。请联想下，不把项目跑起来，怎么把变量添加进去。所以，跑起来成为了问题的线索 --- npm run dev
图二
废话不多说，请看图二，控制台已经很清楚的告诉我们，在执行npm run dev命令的时候，它去运行了webpack.dev.config.js，所有，这个配置文件成为了我们线索，请看下面图三
图三
哟西，这下真相大白，同志们看到没，是plugins(插件)配置中的webpack.DefinePlugin插件把我们的NODE_ENV参数给添加进去的。至于webpack.DefinePlugin插件，我大概去网上查阅了一下，这里做个简单的解释：可以把变量设置成全局变量。这里我们看到，这里把NODE_DEV设置成process.env属性的属性值了。所以，这下大家应该就知道了NODE_DEV这个东西到底是哪里来的了。
OK，说到这里，有些人会疑问，为什么我要去找这个东西。有句话叫没有应用场景的技术都是耍流氓，所以我开始说下这东西可以咋用，欢迎大家补充。
我们知道config文件夹中index.js的proxyTable配置可以帮我们解决跨域的问题，主要这个配置可以让开发服务器去帮助我们发送请求，切记其中的changeOrigin参数设置为true不能少。那么问题来了，如果在开发环境和生产环境中，接口请求的地址不一致的问题，我们可以像下面这样子
图四
OK，说到这里就ending了，如果有错误请大家多多指正，希望对大家有所帮助。
网友评论