vue-cli中 webpack模式的简述及应用

背景：

在公司级开发时，常常需要将开发环境和生产环境分离，比如开发环境需要一些debugger，console操作，生产环境需要执行某些权限校验，这些都可以采用模式进行区分。

vue-cli模式简述：

使用webpack打包构建项目的时候，会使用process.env.NODE_ENV来决定使用哪种模式 常见的模式为development(开发者模式) 和 production (生产模式)

在早期的vue-cli版本中，暴露了webpack选项 不同的 配置文件代表不同的模式

定义了 webpack.prod.conf.js文件，build.js引入了webpack.prod.conf.js配置文件，然后再package json中使用build.js进行模式打包

在vue-cli4的版本中，webpack的相关选项进行了隐藏，可以看到此时已经没有了 build文件夹和config文件夹，启动命令也和之前版本不同 。默认了开发和生产的模式

此时若需要按自定义模式 则需要创建相应的模式配置文件，可以定义任意变量 名称规则为.env.[任意名称]

然后在package.json中指定模式

模式应用

在模板中可以使用定义的模式指定显示

在代码中也可以使用指定的模式执行某段逻辑