uniapp vue3.2+ts h5端分环境打包

news/2024/5/20 3:36:49 标签: uni-app, vue3.2, ts, h5分环境打包

根目录创建 package.json文件

{
  "name": "项目名称",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "uni-app": {
    "scripts": {
      "uat-h5": {
        "title": "uat-h5",
        "env": {
          "UNI_PLATFORM": "h5"
        },
        "define": {
          "UAT-ENV": true
        }
      },
      "prod-h5": {
        "title": "prod-h5",
        "env": {
          "UNI_PLATFORM": "h5"
        },
        "define": {
          "PROD-ENV": true
        }
      },
      "dev-h5": {
        "title": "dev-h5",
        "env": {
          "UNI_PLATFORM": "h5"
        },
        "define": {
          "dev-ENV": true
        }
      }
    }
  },
  "dependencies": {
    "qrcode": "^1.5.3"
  }
}
define为环境标识,建议大写
title为环境名,出现在打包列表
UNI_PLATFORM为打包平台

创建env.uat.ts、env.prod.ts、env.dev.ts文件

const env = {
	restHost:'http://43.139.56.173:8180', // api
	gameUrl:'http://43.139.56.173:8890', // 游戏url
}
export default {
	env
}

创建env.ts文件

import Prod from './env.prod'
import Uat from './env.uat'
import Dev from './env.dev'

//api环境多的话 可以再创建文件引入

//以下是uniapp判断不同环境引入不同配置文件
/*  #ifdef  UAT-ENV */
export const environment =  Uat.env
/*  #endif  */

/*  #ifdef  PROD-ENV */
export const environment =  Prod.env
/*  #endif  */

/*  #ifndef  UAT-ENV || PROD-ENV */
export const environment =  Dev.env
/*  #endif  */

api封装文件引入env.ts文件 api封装时调用

import {environment} from '@/envList/env'
const request = (url,data,method) => {
	const token = uni.getStorageSync('token');
	let header = {
		Token: token,
		'Content-Type':'application/json; charset=utf-8'
	}
	return new Promise ((resolve,reject) => {
		uni.showLoading({
			title: "Loading..."
		});
		uni.request({
			url:environment.restHost+url,
			data:data,
			header:header,
			method:method,
			timeout: 30000,
			success(res) {
				uni.hideLoading();
				// token refresh
				if(res.header['new-token']) {
					uni.setStorageSync('token',res.header['new-token'])
				}
				if (res.data.code == 200) {
					resolve(res.data)
				}else{
					reject(res.data);
					uni.showToast({
						title: res.data.error.msg,
						icon:"error",
						duration:2000
					});
				}
			},
			fail(err) {
				reject(err);
				uni.showToast({
					title: 'error',
					icon:"error",
					duration:2000
				});
			},
			complete() {
				uni.hideLoading();
			}
		})
	})
}
class Http {
	get = function(url,data) {
		return request(url,data,'GET')
	}
	post = function(url,data) {
		return request(url,data,'POST')
	}
}
const http = new Http()
export default{
	http
}

http://www.niftyadmin.cn/n/5233884.html

相关文章

k8s(三): 基本概念-ReplicaSet与Deployment

PeplicaSet ReplicaSet 的目的是维护一组在任何时候都处于运行状态的 Pod 副本的稳定集合,通常用来保证给定数量的、完全相同的 Pod 的可用性。 最佳实践 Deployment 是一个可以拥有 ReplicaSet 并使用声明式方式在服务器端完成对 Pod 滚动更新的对象。 尽管 Rep…

谨慎使用android.view.SurfaceView.setVisibility方法

谨慎使用android.view.SurfaceView.setVisibility方法 why? 原因就是此方法会导致native的内存暴增,前提条件你使用surfaceview去绘制一些复杂的3D图形,绘制复杂、业务复杂的场景; setVisibility方法会调用surfaceView的updateSurface,而此…

华为OD机试真题-万能字符单词拼写-2023年OD统一考试(C卷)

题目描述:有一个字符串数组words和一个字符串chars。 假如可以用chars中的字母拼写出words中的某个“单词”(字符串),那么我们就认为你掌握了这个单词。 words的字符仅由 a-z 英文小写字母组成。 例如: abc chars 由 a-z 英文小写字母和 “?”组成。其中英文问号“?”表示…

西南科技大学模拟电子技术实验五(集成运算放大器的应用设计)预习报告

一、计算/设计过程 设计一:用集成运放设计一个输入为0.05v,放大为-100的反相比例运算电路。 对于理想电路,反相比例运算电路的输出电压与输入电压之间的关系如下: =-100,所以 =100 若是假定R1为100k,则R2= =1k 为了减小输入级偏置电流引起的运算误差,在同相输入端…

Flutter, pub 无法安装依赖 等问题

Flutter 镜像: 配置环境变量: Window: 在我的电脑右键->属性->高级系统设置->环境变量->(用户 或 系统)中新建 # 变量名 变量值 PUB_HOSTED_URLhttps://pub.flutter-io.cn FLUTTER_STORAGE_BASE_URLhttps://storage.flutter-io.…

国际语音群呼系统的产品优势有哪些?为什么要使用国际语音群呼系统?

一、国际语音群呼系统的产品优势: 1.巨量群呼 支持大容量并发群呼,呼叫不受限制,充裕的线路保障造就百万级平台容量,可以短时间内同时拨打大量电话,让语音快速到达,大大提高发送效率; 2.自主…

生成带依赖Jar 包的两种常用方式:IDEA打包工具:Artifacts 和 maven-shade-plugin

文章目录 前言1、IDEA打包工具:Artifacts1.1 创建Artifacts1.2 选择第三方jar文件1.3 打包Artifacts1.4 测试jar包 2、maven-shade-plugin2.1、pom文件添加2.2、打包2.3、测试jar包 总结 前言 当我们编写完Java程序后,为了提高执行效率通常会将应用程序…

测试:测试设计方法

一、等价类划分 等价类划分是一种软件测试方法,它将程序的输入域划分成若干部分(子集),然后从每个子集中选取具有代表性的数据作为测试用例。等价类划分旨在确保测试用例的完整性和代表性,同时避免冗余测试。 等价类划…