前言：npm run serve 命令执行默认打开的是开发环境的项目，有时候想要在本地项目中看一下生产环境的数据，我们就可以通过自定义scripts命令来实现。

自定义scripts命令

第一步：在项目根目录下新建 .env文件

一般来说development对应的是开发环境，而production对应的是生产环境

文件格式：

VUE_APP_MODE = 环境名字
VUE_APP_BASEURL = 环境地址

图例：

第二步：在package.json–>scripts下配置对应的环境命令

scripts 是 package.json 中内置的脚本入口，是 key-value 键值对配置，key 为可运行的命令，可以通过 npm run xxx 来执行命令。

通过新增--mode xxx来配置不同环境的命令，注意：--mode xxx中的xxx要和.env.xxx中的xxx一一对应

• 通过npm run serve执行的命令默认启动开发环境的项目
• 通过npm run serve:pro 执行的命令是启动生产环境的项目
• 通过npm run build:dev执行的命令是打包开发环境的项目
• 通过npm run build:pro执行的命令是打包生成环境的项目

获取配置的环境地址

通过process.env.VUE_APP_BASEURL获取环境地址

打印process.env中的数据如下：