vue-cli3配置环境变量

在 vue 的开发中,vue-cli 为我们提供了基本的环境变量NODE_ENV以及三种模式:developmentproductiontest

但是在实际开发中,可能还需要更多的环境变量。那么如何添加自定义的环境变量呢。

你可以替换你的项目根目录中的下列文件来指定环境变量:

1
2
3
4
.env                # 在所有的环境中被载入
.env.local # 在所有的环境中被载入,但会被 git 忽略
.env.[mode] # 只在指定的模式中被载入
.env.[mode].local # 只在指定的模式中被载入,但会被 git 忽略

比如,我们可以新建一个 .env 文件,然后写入一下环境变量:

1
VUE_APP_NETWORK=215

注意!只有以 VUEAPP 开头的变量才会被正确载入。

然后就可以在 vue 内部使用这个环境变量了,同时也可以在 package.json 中用 cross-env 重写环境变量的值,当前你首先要安装 cross-env 这个插件

更详细的使用方法可以参看 官方文档