uni-app CLI:APP 多环境打包(测试/正式)最简配置 + `import.meta.env` 为 `undefined` 的解决

要达成的效果

  • npm run build:app-plus:test → APP 走测试接口:https://api-test.example.com/prod-api
  • npm run build:app-plus:prod → APP 走正式接口:https://api.example.com/prod-api

需要改的 3 个地方

1).env.build-dev(测试)

ini 复制代码
VITE_API_BASE_URL=https://api-test.example.com

2).env.production(正式)

ini 复制代码
VITE_API_BASE_URL=https://api.example.com

3)package.json(两条命令)

json 复制代码
{
  "scripts": {
    "build:app-plus:test": "uni build --platform app-plus --mode build-dev",
    "build:app-plus:prod": "uni build --platform app-plus --mode production"
  }
}

import.meta.env 为啥在 APP 里会是 undefined

APP 端有些链路下不会稳定保留 import.meta.env。最稳做法是:构建时把域名写死进产物

最简单写法

vite.config.js 注入一个编译期常量:

js 复制代码
define: {
  __VITE_API_BASE_URL__: JSON.stringify(apiBaseUrl)
}

在 使用的地方优先读它:

js 复制代码
const envApiBase =
  typeof __VITE_API_BASE_URL__ !== "undefined"
    ? __VITE_API_BASE_URL__
    : import.meta?.env?.VITE_API_BASE_URL;
相关推荐
毕设源码-邱学长2 小时前
【开题答辩全过程】以 基于 uni-app Node.js 的音乐系统设计与实现为例,包含答辩的问题和答案
uni-app
qq_316837752 小时前
华为obs 私有桶 音频 使用uniapp 安卓端播放-99的问题
uni-app·音视频
凉辰17 小时前
uniapp实现生成海报功能 (开箱即用)
javascript·vue.js·小程序·uni-app
笨笨狗吞噬者18 小时前
【uniapp】小程序支持分包引用分包 node_modules 依赖产物打包到分包中
前端·微信小程序·uni-app
har01d1 天前
uni-app 自动更新检测弹窗,踩坑记录
uni-app
Muchen灬1 天前
【uniapp】(3)引入uviewUI组件
uni-app
毕设源码-朱学姐2 天前
【开题答辩全过程】以 基于uniapp的云笔记系统的设计与实现为例,包含答辩的问题和答案
笔记·uni-app
游戏开发爱好者82 天前
如何使用Instruments和Keymob进行Swift应用性能优化分析
开发语言·ios·性能优化·小程序·uni-app·iphone·swift
外派叙利亚2 天前
uniapp 颜色卡条拖动
前端·javascript·uni-app