网站Logo 青雨青杨

配置文件.env的使用

yangpf5271
13
2025-11-23

1.新建文件

.env文件在项目根目录新建

.env 无论开发环境还是生产环境都会加载

.env.development 开发环境(serve)默认加载这个文件

.env.production 生产环境(build)默认加载这个文件

2.增加变量

定义变量需要以 VUE_APP_ 作为前缀

VUE_APP_BASE_URL = http://www.myhost.com

如果是vue3+vite则需要以VITE_作为前缀如:

VITE_BASE_URL = http://www.myhost.com

3.自定义

如果env命名非【.env.development 、.env.production 】,如【.env.test、.env.prod】,则需在package.json中配置启动参数(--mode 文件名)

"scripts": {

"serve": "vue-cli-service serve",

"serve:dev": "vue-cli-service serve --mode test",

"serve:pro": "vue-cli-service serve --mode prod",

"build": "vue-cli-service build",

"lint": "vue-cli-service lint"

},

4.验证是否生效

测试变量是否生效, 可直接在 main.js 中打印测试

vue2:console.log(process.env)

vue3:console.log(import.meta.env)

动物装饰