vue3+vite 多个环境配置

同一套代码 再也不用在不同的环境里来回切换请求地址了

然后踩了一个坑 就是env的文件路径是在当前项目下 不是在views内

因为公司项目需求只有dev和pro两个环境 虽然我新增了3个 但是只在这两个里面配置了 .env是可以配置一些公共配置的 目前需求来说不需要 所以我也懒得配了。

typescript 复制代码
#【开发环境】
VITE_ENV = development
VITE_API_URL = http://xxxx/
typescript 复制代码
# 【生产环境】
VITE_ENV = production
VITE_API_URL = https://xxxx/

在请求的地址也配置上

typescript 复制代码
baseURL:import.meta.env.VITE_API_URL,// 设置基础 URL/\

个人觉得vite比webpack的打包好用 更方便 不需要在其他config文件内再配置什么东西

包括项目也会用到的 上传图片功能 因为上传的方法需要用其他的header类型去请求所以是单独写的请求方法 按照之前的逻辑可以固定封装一个上传图片的组件 现在不用拉 直接用env自己定义的环境地址即可。

相关推荐
anOnion2 小时前
构建无障碍组件之Menu Button pattern
前端·html·交互设计
用户47949283569152 小时前
claude Fable用不了?把Gpt 5.5pro接到你的claude code里
前端·后端
zhangxingchao5 小时前
Kotlin常用的Flow 操作符整理
前端
IT_陈寒6 小时前
React的useState居然还有这种坑?我差点删库跑路
前端·人工智能·后端
Pedantic7 小时前
SwiftUI 手势笔记
前端·后端
橙子家8 小时前
浏览器缓存之【结构化数据库与缓存】: IndexedDB、Cache storage 和 Storage buckets
前端
user20585561518138 小时前
X6 中边悬浮置顶,规避 `mouseleave` 事件丢失问题
前端
李明卫杭州8 小时前
CSS aspect-ratio 属性完全指南
前端
Pedantic10 小时前
SwiftUI 手势层级(Gesture Hierarchy)详解
前端