将uniapp生成的H5上线到微软商店
uniapp配置
- mainfest.json Web配置中运行的基础路径设置为
./
,意思是相对路径
electron入口文件 main.js
const {app, BrowserWindow, Menu} = require('electron')
const path = require("path")
const createWindow = () => {
Menu.setApplicationMenu(null)
const win = new BrowserWindow({
width: 410,
height: 760,
icon: path.join(__dirname, "./logo/SampleAppx.150x150.png.jpg") //页面图标
})
win.loadFile('./source/index.html') //将uniapp打包的h5放置在main.js 同级目录中
}
app.whenReady().then(() => {
createWindow()
})
electron打包成exe
npm install electron-packager
electron-packager ./ exeName --asar --icon='./logo/logo.ico' --out='./packageOut' --overwrite --download.mirrorOptions.mirror=https://npm.taobao.org/mirrors/electron/
# ./ 入口文件
# exeName
# --asar 将源码包打包成为asar文件
# --icon 打包的exe的图标
# --out 输出目录
# --overwrite
# --download.mirrorOptions.mirror 加速镜像在中国区域请使用此参数,要不然打包速度会非常慢
将exe打包成appx
npm install electron-windows-store
electron-windows-store --package-name packageName --identity-name xxxxxx.xxxxxx --publisher-display-name xxx --assets ./build/appx --input-directory ./packageOut/vCardTools-win32-x64 --output-directory ./packageOut/msStore --package-version 1.0.6.0
# --package-name
# --identity-name 在微软商店创建应用后获取
# --publisher-display-name 在微软商店创建应用后获取
# --assets 静态文件目录,生成的appx的logo图标放在此目录,图片大小及命名规则如下
# ![SampleAppx.44x44.png]
# ![SampleAppx.50x50.png]
# ![SampleAppx.150x150.png]
# ![SampleAppx.310x150.png]
# --input-directory 入口文件
# --output-directory 出口文件
# ----package-version 版本号
将appx打包成appxbundle
微软商店规定如果第一次上传的bundle包,则后续更新都要上传bundle包
- 创建输入文件 a.txt
[Files]
"E:\ME\tel-electron\packageOut\msStore\vCardTools.appx" "vCardTools.appx"
- 执行打包命令
makeappx 在windowsKit中,执行electron-windows-store时可将其安装,安装后添加到系统变量中
MakeAppx a.txt /output/a.appxbundle