vue配置多环境

学习链接

.env.development(开发环境)、.env.prodction(正式环境)、自定义环境的使用

vue环境变量配置——process.env(详细)

vue中 .env .env.development .env.production 详细说明

步骤

.env.dev

NODE_ENV = 'devV'
VUE_APP_TITLE = 'devv'

# 必须是NODE_ENV、BASE_URL、或以VUE_APP_开头
# 这样配置会不起作用
a = b

.env.prod

NODE_ENV = 'prodD'
VUE_APP_TITLE = 'prodd'

package.json

使用--mode 指定模式,然后使用npm run server启动开发环境,使用npm run prod启动生产环境环境。注意:打包那里也要添加--mode=prod

  "scripts": {
    "serve": "vue-cli-service serve --mode=dev",
    "serve:prod": "vue-cli-service serve --mode=prod",
    "build": "vue-cli-service build --mode=prod"
  }

main.js

可以打印出来看看

...
console.log(process.env.VUE_APP_TITLE);
console.log(process.env);
...

npm run server启动开发环境,打印如下
在这里插入图片描述

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值