前言

在自定义配置Vue-cli 的过程中，突然有了下面的疑问，

为什么打包扔测试环境时，不能直接改变其 NODE_ENV 值，而是通过VUE_APP_ENV_NAME (以VUE_APP_开头的变量)来区分呢？

后来想想这是不同的配置策略导致的，虽然我扔的是测试环境，但构建出来的包还是要生产环境的包，由此我又产生了另一个疑问：

我在vue-cli-service build 时，NODE_ENV 设置成其他值，会发生什么？打出来的包是什么样子？

主要内容
下面说说如果直接改变其 NODE_ENV 值会发生什么？
简单来说，打包出来的文件会跟production模式下打包的文件不一样，没有集成production包的各个优点。

具体来说会有下面几种情况：
1、直接 NODE_ENV = ‘test’， 它会创建一个优化过，并且旨在用于单元测试的 webpack 配置，它并不会处理图片以及一些对单元测试非必需的其他资源。表面来看，就是没有进行代码分割只有一个js文件，以及没有hash等。

2、NODE_ENV=“development”，它会创建一个 webpack 配置，该配置启用热更新，但不会对资源进行 hash 也不会打出 vendor bundles，打包出来的文件跟NODE_ENV="development"模式下打出来的包一样。

3、NODE_ENV=“someone”，环境变量随便给一个值，它会默认为NODE_ENV=“development” 的打包策略。包内的内容如下：

总结：
运行 vue-cli-service build 命令时，无论部署到哪个环境，都应该始终把 NODE_ENV 设置为 “production“ ，区别环境时可以以 VUE_APP_ 开头的变量命名赋值（我一般取名为 VUE_APP_ENV_NAME）。

拓展：
对于如何进行webpack配置来区分所在环境，以及想根据不同的环境，进行一些独特的配置，可以参考我的下一篇文章。

参考资料：
VUE模式和环境变量