当前位置： 首页 > article >正文

Vue3 -- 环境变量的配置【项目集成3】

article 2024/11/16 1:50:27

环境：

在项目开发过程中，至少会经历开发环境、测试环境和生产环境(即正式环境)三个阶段。

  • 开发环境 .env.development
  • 测试环境 .env.test
  • 生产环境 .env.production

不同阶段请求的状态(如接口地址等)不一样，开发项目的时候要经常配置代理跨域，若手动切换接口地址是繁琐而且很容易出错。

.env.development文件：

# 变量必须以 VITE_ 为前缀才能暴露给外部读取
NODE_ENV = 'development'
VITE_APP_TITLE = '小圣运营平台'
VITE_APP_BASE_API = '/dev-api'

在这里插入图片描述

.env.production文件：

NODE_ENV = 'production'
VITE_APP_TITLE = '小圣运营平台'
VITE_APP_BASE_API = '/prod-api'

在这里插入图片描述

.env.test文件：

NODE_ENV = 'test'
VITE_APP_TITLE = '小圣运营平台'
VITE_APP_BASE_API = '/test-api'

在这里插入图片描述

配置package.json文件：

"build:test": "vue-tsc && vite build --mode test",
"build:pro": "vue-tsc && vite build --mode production",

在这里插入图片描述

测试：

在这里插入图片描述
在这里插入图片描述
没有问题，可以获取到！


http://www.kler.cn/a/395182.html

相关文章：

  • Unity教程（十八）战斗系统 攻击逻辑
  • java基础入门学习09-迭代器
  • Linux 下 mysql 9.1 安装设置初始密码 【附脚本】
  • 轮转数组
  • Java集合框架之Collection集合遍历
  • MySQL高级（二）：一条更新语句是如何执行的
  • StructuredStreaming （一）
  • 【golang-技巧】- pprof 添加开关
  • Leetcode刷题Python之3258.统计满足k约束的子字符串I
  • SSM学习记录（二）之SSM整合配置
  • 【Unity基础】对比OnCollisionEnter与OnTriggerEnter
  • 机器学习：CatBoost模型（高级版）——高效且强大的树形模型
  • 深度学习知识点5-马尔可夫链
  • 等保测评怎么做？具体流程是什么？
  • 鸿蒙UIAbility
  • 基于微信小程序的在线疫苗预约的设计与实现，LW+源码+讲解
  • 搜维尔科技：Haption力触觉交互，虚拟机械装配验证
  • 【K8S问题系列 | 9】如何监控集群CPU使用率并设置告警？
  • C++《继承》
  • SpringBoot -- 自动化装配源码
  • 江协科技之STM32驱动1.3寸/0.96寸/0.91寸OLED显示屏介绍
  • js中import引入一个export值可以被修改。vue，react
  • 【计网】计算机网络概述笔记
  • 使用frp工具实现内网穿透
  • 基于yolov8、yolov5的车型检测识别系统（含UI界面、训练好的模型、Python代码、数据集）
  • Scala的迭代器