uniapp 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://xxx', // api
	gameUrl:'http://xxx', // 游戏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
}

相关推荐

  1. uniapp vue3.2+ts h5环境打包

    2023-12-05 17:56:05       36 阅读
  2. tsdx 打包ts项目

    2023-12-05 17:56:05       16 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-05 17:56:05       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-05 17:56:05       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-05 17:56:05       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-05 17:56:05       20 阅读

热门阅读

  1. 121. 买卖股票的最佳时机

    2023-12-05 17:56:05       35 阅读
  2. 编译原理Lab2-用bison完成语法分析器

    2023-12-05 17:56:05       33 阅读
  3. Hbuilderx+vue2+微信小程序 预览pdf

    2023-12-05 17:56:05       29 阅读
  4. 自己生成二维码

    2023-12-05 17:56:05       35 阅读
  5. oops-framework框架 之 音频管理(六)

    2023-12-05 17:56:05       45 阅读
  6. 【Redis】Redis缓存使用问题

    2023-12-05 17:56:05       52 阅读
  7. Whisper

    Whisper

    2023-12-05 17:56:05      33 阅读
  8. vue 路由跳转到其他页面指定位置(锚点)

    2023-12-05 17:56:05       34 阅读
  9. kafka kraft 集群搭建保姆级教学 包含几个踩坑点

    2023-12-05 17:56:05       37 阅读
  10. Spring Boot 统⼀数据返回格式

    2023-12-05 17:56:05       38 阅读
  11. IntelliJ IDEA详细完整安装教程

    2023-12-05 17:56:05       32 阅读
  12. 智慧城市大脑,运维无忧!

    2023-12-05 17:56:05       41 阅读