使用uniapp打包需要ios证书，正式上架的时候还需要提供各种尺寸的设备的APP截图，还需要使用xcode等工具上传ipa文件上传。

这些都需要使用mac电脑、ios设备去完成。

假如我们只有windows电脑，也没有这么多ios设备去截图。

我们可以使用香蕉云编来生成证书，然后上架的时候使用香蕉云编去生成app截图和上传ipa到app store

https://www.yunedit.com/

本地无法预览：参考链接 https://blog.csdn.net/qq2468103252/article/details/127490674
dist打包产物中对比一下就能看到，抖音小程序比微信小程序少了一个 sourcemap 文件夹

到对应的开发者工具里面搜索 sourcemap，微信小程序的产物中 sourcemap 是引用了独立 sourcemap 文件夹中的文件，而字节小程序的产物中，sourcemap 就是base64编码后内联形式存在产物文件中了。

这就能解释得通了，为什么抖音的包体积大这么多，那接下来就是想办法，如何才能跟微信小程序一样单独生成一份 sourcemap 文件夹，官网也找不到相关资料，只能看 uni-build 的源码了，参考链接：https://www.cnblogs.com/MrSi/p/13570546.html
应该就是这两份关键文件：仅当打包到微信平台时，才会在 '../.sourcemap/' + process.env.UNI_PLATFORM + '/[name].js.map' 这个相对路径下生成 sourcemap 文件，巨坑！暂时没找到原因，为什么仅针对微信单独生成 sourcemap文件夹

那依葫芦画瓢，在 vue.config.js 中添加这个 sourcemap 插件即可

现在包体积已经正常了，缩小了3倍，终于可以正常预览了

运行到鸿蒙模拟器报HBuilder X 运行设备不兼容鸿蒙模拟器目前只能在arm64平台运行

我们非常高兴地宣布，wot-design-uni 组件库的最新版本 1.5.0 于 2024 年 12 月 9 日正式发布！这一版本不仅引入了许多令人期待的新功能，还进行了文档更新和多个 Bug 修复，进一步提升了用户体验和组件的灵活性。

GitHub Star 数突破 10000

令人振奋的是，wot-design-uni 在 GitHub 上的 Star 数量已经超过了 10000！这一里程碑的达成，离不开每一位用户的支持与反馈。我们深感荣幸，并将继续努力，为大家提供更优质的组件。

✨ 新功能

1. Divider 分割线功能优化：支持虚线、垂直等多种样式，增强了设计灵活性。
2. Calendar 组件优化：改进了选中样式和滚动位置处理，并支持屏蔽内置 cell，提升了用户体验。
3. Curtain 幕帘新增功能：新增 close 插槽和自定义关闭插槽样式类，提供更多自定义选项。
4. DropMenuItem：增加自定义 Popup 样式参数，增强了菜单的灵活性。
5. Input 和 Textarea 支持 inputmode：在 APP-VUE 和 H5 端提供更好的输入体验。
6. MessageBox 新增 ButtonProps 属性：允许用户自定义确认和取消按钮的样式，增强了交互性。
7. Radio 组件：添加了 icon-placement 属性，用于控制图标方向。
8. Segmented 组件：提供了 updateActiveStyle 方法，允许用户设置激活样式。
9. Table 组件：支持设置不固定表头，提升了表格的使用灵活性。
10. Upload 组件：新增文件重传功能，提升了文件上传的便利性。

✏️ 文档更新

我们对文档进行了全面的优化，增加了内容的可用宽度，并支持收起演示 demo。此外，新增了关于 MessageBox 自定义按钮样式和 Sass 的介绍，帮助用户更好地理解和使用组件。

Bug 修复

在 1.5.0 版本中，我们针对多个关键问题进行了修复，包括：

• Button 按钮：解决了设置为 block 时无效的问题。
• Cell 组件：修复了 label 过长时影响页面结构的情况。
• Collapse 组件：确保在数据变化时折叠面板状态能够正确更新。
• GridItem：修复了徽标属性类型标注错误的问题。
• Progress 组件：解决了无法设置进度为 0 的问题。
• Swiper：修复了在支付宝小程序平台点击事件无效的问题。
• Tab 组件：修复了未渲染项高度影响整体高度的问题。
• 其他多个组件的 Bug 修复，确保了更稳定的使用体验。

结语

感谢大家对 wot-design-uni 的支持与关注！我们将继续倾听用户的声音，致力于不断改进和完善我们的组件库。期待在未来的版本中为大家带来更多惊喜和功能！如需了解更多详情，请访问我们的 GitHub 页面或者插件市场地址。

不同云服务空间(阿里云，支付宝云等)存在差异，详细流程加微信 pce105 ,一对一讲解，远程协助部署调试

厂家提供的安卓原生的sdk，用来连接硬件的蓝牙，拿硬件的数据，需要做成uniapp的插件在uinapp使用，价格看具体难度，能做的麻烦留一下联系方式

自研uniapp+vue3+pinia2多端酒店订房管理系统Uni-WeTrip(h5+小程序+App端)

uniapp-vue3-wetrip原创基于vite5+uniapp+pinia2+uni-ui等技术开发的仿去哪儿/携程预约酒店客房app系统。实现首页酒店展示、预订搜索、列表/详情、订单、聊天消息、我的等模块。支持编译H5+小程序+App端。

uniapp+vue3+pinia2+uvui跨多端酒店预订app系统

技术栈

• 跨端框架：Uniapp + Vue3
• 构建工具：Vite5
• 状态管理：Pinia2
• UI组件库：uni-ui + uv-ui
• 缓存技术：pinia-plugin-unistorage

功能性

• 开发工具：HbuilderX 4.36
• 跨平台兼容性：支持H5、小程序和App端，确保在不同设备上的无缝体验。
• 实时消息聊天：内置的消息聊天功能模块，增强用户间的沟通效率。
• 自定义组件：提供uv3-navbar标题栏和uv3-tabbar菜单栏等自定义组件，方便开发者根据需求进行调整。
• 缓存机制：利用pinia-plugin-unistorage实现数据缓存，提高应用性能。

项目结构

uni-vue3trip布局模板

<script setup>  
    // #ifdef MP-WEIXIN  
    defineOptions({  
        /**  
         * 解决小程序class、id穿透问题  
         * manifest.json中配置mergeVirtualHostAttributes: true, 在微信小程序平台不生效，组件外部传入的class没有挂到组件根节点上，在组件中增加options: { virtualHost: true }  
         * https://github.com/dcloudio/uni-ui/issues/753  
         */  
        options: { virtualHost: true }  
    })  
    // #endif  
    const props = defineProps({  
        // 是否显示自定义tabbar  
        showTabBar: { type: [Boolean, String], default: false },  
    })  
</script>  

<template>  
    <view class="uv3__container flexbox flex-col flex1">  
        <!-- 顶部插槽 -->  
        <slot name="header" />  

        <!-- 内容区 -->  
        <view class="uv3__scrollview flex1">  
            <slot />  
        </view>  

        <!-- 底部插槽 -->  
        <slot name="footer" />  

        <!-- tabbar栏 -->  
        <uv3-tabbar :show="showTabBar" transparent zIndex="99" />  
    </view>  
</template>

uni-app+vue3自定义导航条/菜单栏

const props = defineProps({  
    // 当前选中项  
    current: { type: [Number, String] },  
    // 背景色  
    bgcolor: { type: String, default: '#fff' },  
    // 颜色  
    color: { type: String, default: '#333' },  
    // 激活颜色  
    activeColor: { type: String, default: '#f90' },  
    // 是否固定  
    fixed: { type: [Boolean, String], default: false },  
    // 是否背景透明  
    transparent: { type: [Boolean, String], default: false },  
    // 是否中间凸起按钮  
    dock: { type: [Boolean, String], default: true },  
    // 设置层级  
    zIndex: { type: [Number, String], default: '2024' },  
    // 自定义iconfont字体图标库前缀  
    customPrefix: { type: String, default: 'uv3trip-icon' },  
    // 自定义样式  
    customStyle: String,  
    // 是否显示  
    show: { type: Boolean, default: true },  
    // tab选项  
    tabs: {  
        type: Array,  
        default: () => []  
    }  
})

uniapp预订功能

<!-- 日历 -->  
<uv3-popup  
    v-model="isVisibleCalendar"  
    title="选择日期"  
    position="bottom"  
    round  
    xclose  
    xposition="left"  
    :customStyle="{'overflow': 'hidden'}"  
    @open="showCalendar=true"  
    @close="showCalendar=false"  
>  
    <uv-calendars  
        v-if="showCalendar"  
        ref="calendarRef"  
        mode="range"  
        insert  
        color="#ffaa00"  
        :startDate="startDate"  
        :endDate="endDate"  
        :date="rangeDate"  
        :selected="dingDate"  
        title="选择日期"  
        start-text="入住"  
        end-text="离店"  
        @change="handleCalendarChange"  
    />  
</uv3-popup>

uniapp+vue3聊天模块

之前有开发一款uniapp+vue3聊天app实例，就不作过多的介绍，如果感兴趣可以去看看下面这篇文章。
https://www.cnblogs.com/xiaoyan2017/p/18165578

过往跨平台实战项目

HarmonyOS-Chat聊天室|纯血鸿蒙Next5 api12聊天app|ArkUI仿微信

tauri2.0-admin桌面端后台系统|Tauri2+Vite5+ElementPlus管理后台EXE程序

Electron32-ViteOS桌面版os系统|vue3+electron+arco客户端OS管理模板

electron31+vite5+element-plus桌面端聊天EXE

flutter3+dart3+getx跨端仿抖音App短视频直播实战

作者：xiaoyan2017
链接： https://www.cnblogs.com/xiaoyan2017
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

worker插件地址

部分还不知到怎么在子线程中调用uni相关的api的，这里写一个简单的示例。

子线程中

postMessage({  
type:'showToast',  
param:'弹窗'  
});

主线程接收参数，调用uni相关api

this.worker.message = (e) => {  
const {type,param} = e;  
 uni[type]({  
content:param  
})  
}  

[Info] 正在制作apk安装包...

[Error] 进程已崩溃
[Info] begin replace files to apk...
[Info] begin copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-hdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-hdpi/icon.png]...
[Info] copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-hdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-hdpi/icon.png] success.
[Info] begin copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-xhdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xhdpi/icon.png]...
[Info] copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-xhdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xhdpi/icon.png] success.
[Info] begin copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-xxhdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xxhdpi/icon.png]...
[Info] copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-xxhdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xxhdpi/icon.png] success.
[Info] begin copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-xxxhdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xxxhdpi/icon.png]...
[Info] copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/icon-android-xxxhdpi.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xxxhdpi/icon.png] success.
[Info] begin copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/splash-android-hdpi.9.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-hdpi/splash.9.png]...
[Info] copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/splash-android-hdpi.9.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-hdpi/splash.9.png] success.
[Info] begin copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/splash-android-xhdpi.9.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xhdpi/splash.9.png]...
[Info] copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/splash-android-xhdpi.9.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xhdpi/splash.9.png] success.
[Info] begin copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/splash-android-xxhdpi.9.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xxhdpi/splash.9.png]...
[Info] copy file[D:/前端/APP/dist/app/unpackage/cache/wgt/H5EAB6485/.manifest/splash-android-xxhdpi.9.png] to [C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/H5EAB6485_cm/res/drawable-xxhdpi/splash.9.png] success.
[Info] begin update files to apk...
[Error] try compile package:0
[Error] 进程已崩溃
[Info] begin zipalign apk:C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/release/apk/H5EAB6485_nosign.apk
[Error] Unable to open 'C:/Users/Administrator/AppData/Local/HBuilder X/AndroidPackWork/cache/H5EAB6485/packge_cache/NONE/release/apk/H5EAB6485_nosign.apk' as zip archive
[Error] Apk zipalign failed
[Error] 制作结果：Failed. Reason:

uniapp 程序内嵌 H5链接，然后进入H5的聊天系统进行聊天跳转分享订单，在H5链接页面通过window.parent.postmessage发送消息后，uniapp 的内嵌页面 web浏览器能接受到信息，接收到信息后能在程序里面能跳转到订单详情页面去。但 打包出的APP 及模拟器手机上 即没有报错，也没有提示，不能跳转去订单详情。 请问是 uniapp 不支持吗 ？还是被阻止了？

H5页面发送信息代码：
const oRderDetail=( val )={
const message ={
topic:'share_id',
data:{share_id: val.messageContent? orderId }
if(window.FlutterChannel){
window.FlutterChannel.postMessage(encodeURIComponent(JSON.stringify(message)))
}else{
window.parent.postMessage(message)
}
}
}

uniapp 接收消息的 代码如下：
iframeLoadedMsg(){
let that=this
window.addEventListener('message', function(event) {
console.log(event.data)
if (event.data.topic==="shareOrder"){
that.share_id = event.data.data.share_id
//that.$router.push({path:/expert/expertHome/openDetail?shareId=${this.share_id}})
that.$router.push({name:'ExpertOpenDetail',query:{shareId: that.share_id}})
}
}, false);
},
在web 浏览器，两个跳转方式如下，他们都能够跳转，但是APP 和安卓模拟器（链接的手机）点击分享跳转，就是一点反应都没有，搞弹框提示，也没有弹框。但是在HBuilder X 的内置 web浏览器 能够跳转：
that.$router.push({path:/expert/expertHome/openDetail?shareId=${this.share_id}})
that.$router.push({name:'ExpertOpenDetail',query:{shareId: that.share_id}})

在小米 14 上跳转会员中心能正常跳转 小米10和小米pad5上无法正常显示页面 直接白屏

场景： UTS 和 web-view 通信时传输json 中包含中文或其他特殊字符

如果单纯使用atob 和 btob 无法处理包含的中文，可以使用 TextEncoder和 TextDecoder编码解码

UTS 发送数据时：
let v1 = uni.createWebviewContext("web-view")
let dataStr:string = JSON.stringify(jdata as UTSJSONObject)
// 转uint8array 直接传！！！！！！！！！
let encoder = new TextEncoder()
let u8arry = encoder.encode(dataStr)
console.log('getOcrData -----> 向网页发送数据' ,u8arry)
v1?.evalJS(testrece("${u8arry}"))

UTS 接收数据时：
// 解码
let str = recMessage[0]["data"] as string
let strAry: string[] = str.split(',')
let setAry: number[] = []
//循环strary 写入setARY
strAry.forEach(element => {
setAry.add(parseInt(element))
})

let utf8decoder = new TextDecoder();
let rststr = utf8decoder.decode(Uint8Array.from(setAry))
console.log('接收的转换-----', rststr.toString())

web-view中接收uint8array并解析json:
// 尝试解码
// 1. 将字符串按 ',' 分割，并转换为数字数组
let strArray = str.split(',').filter(Boolean); // 去掉空字符串
let byteArray = new Uint8Array(strArray.map(Number)); // 转换为 Uint8Array
let decoder = new TextDecoder('utf-8')
try {
let jsonStr = decoder.decode(byteArray)
let jsonObj = JSON.parse(jsonStr)
// uts内打印日志
uni.postMessage({
data: {
event: 'consolelog',
data: 转码失败.${jsonObj.id}
}
})
} catch (error) {
// uts内打印日志
uni.postMessage({
data: {
event: 'consolelog',
data: 转码失败.${error.message}
}
})
}

web-view中编码Json发送:
let jsonObj = {
"id": "1234567890",
"name": "张三",
"age": 25,
"gender": "男",
}
let encoder = new TextEncoder()
let encodedData = encoder.encode(JSON.stringify(jsonObj))
let byteArrayString = Array.from(encodedData).join(',')
uni.postMessage({
data: {
event: 'test',
data: byteArrayString
}
})

Json 数据完整完美显示!