在项目开发的时候，我们通常会将程序分为开发环境和生产环境（或者叫线上环境），开发环境通常指的是我们正在开发的这个阶段所需要的一些环境配置，也就是方便我们开发人员调试开发的一种环境；生产环境通常指的是我们将程序开发完成经过测试之后无明显异常准备发布上线的环境，也可以理解为用户可以正常使用的就是生产环境；

当然开发环境和生产环境在配置方面的需求是不一样的，但是有共同点：

开发环境的需求：

模块热更新 （本地开启服务，实时更新）
sourceMap (方便打包调试)
接口代理 (配置proxyTable解决开发环境中的跨域问题)
代码规范检查 (代码规范检查工具)

生产环境的需求：

提取公共代码
压缩混淆(压缩混淆代码，清除代码空格，注释等信息使其变得难以阅读)
文件压缩/base64编码(压缩代码，减少线上环境文件包的大小)
去除无用的代码

开发环境和生产环境的共同需求：

同样的入口
同样的代码处理(loader处理)
同样的解析配置

在我们搭建好Vue-cli脚手架之后，我们的build文件夹会分别自动的生成webpack.base.conf.js、webpack.dev.conf.js、webpack.prod.conf.js三个webpack配置文件；
webpack.base.conf.js：webpack的开发环境和生产环境的共有配置(开发环境和生产环境都是需要执行的配置)
webpack.dev.conf.js：webpack的开发环境的特有配置(只在开发环境中执行，生产环境中不执行)
webpack.prod.conf.js：webpack的生产环境的特有配置(只在生产环境中执行，开发环境中不执行)

我们为什么要区分开发环境和生产环境呢？

因为一个项目的开发过程中肯定不会是一个版本开发完之后就立马上线，开发是必需，上线是目的；在开发的过程中会有各种各样的问题，比如开发环境中跨域、开发环境和生产环境因环境不同而产生的未知奇葩错误等等都是会时常发生的，我们区分环境的目的就是为了让开发人员在开发的过程中可以方便调试，保持高效的开发；让程序在生产环境中正常有效的运行；