uniapp + electron 打包项目

参考文献

1、控制台安装electron和electron打包工具electron-packager

npm install electron -g
npm install electron-packager -g

2、manifest.json修改

在这里插入图片描述运行的基础路径修改为:./ 不然打包出来会出现白屏,读取不到,因为打包出来的h5默认加载地址为/static/
去掉启用https协议: 不然会出现网络无法加载,去掉https不影响你请求后端的https协议。(这个可加可不加,主要是看后台有没有配置白名单这种的,影响不大)

3.h5正常打包,打包后再h5文件夹下新建 package.json和main.js文件

main.js也可以改成其他的js名称,但是package.json里面的 {main:其他.js}记得改
在这里插入图片描述
注意: build 文件 的根目录要注意,如果项目没打包过app端,则会再最外层App.vue同级生成/dist/build/h5 文件,如果之前有打包过app端的,则是多一层 unpackage/dist/build/h5

package.json 内容

我的应用—》对应之前设置的web配置的页面标题,我的是 judarhr_content_distribution

{"name":"我的应用","version":"2.0","main":"main.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","electron":"electron .","start":"electron .","build":"electron-packager ./ 我的应用 --plantform=win32 --arch=x64 --out 我的应用 --overwrite --icon=xdt.ico"},"author":"","license":"ISC","devDependencies":{"electron":"^23.3.13","electron-packager":"^12.2.0"}
}

main.js

const {app, BrowserWindow} = require('electron')
const path = require('path')
const url = require('url')let winfunction createWindow () {win = new BrowserWindow({width: 700, height: 400,icon:'./static/logo.png', //autoHideMenuBar:true,//隐藏菜单栏})//加载本地文件 index.htmlwin.loadURL(url.format({pathname: path.join(__dirname, 'index.html'),protocol: 'file:',slashes: true}))//打开控制器win.webContents.openDevTools();//点击关闭的时候, win 一定要释放掉win.on('closed', () => {win = null})
}
//加载窗体
app.on('ready', createWindow)//IOS 关闭页面(ios比较特殊win.on('closed')只是关闭显示窗口,但是后台还是会存在,更像是隐藏窗体,所以需要这种判断方式推出)
app.on('window-all-closed', () => {if (process.platform !== 'darwin') {app.quit()}
})app.on('activate', () => {if (win === null) {createWindow()}
})

如果你的网页首页的文件名不是 “index.html”,那么请在 main.js 中将其中的 ‘index.html’ 修改为你的网页首页名。

4、打包

\dist\build\h5文件夹处执行打包命令

npm run build

5、运行

npm run start

关闭窗口则整个electron 关闭,得重新运行

6、进入调试模式

第一种:ctrl+shift+i
第二种:main.js配置 win.webContents.openDevTools();

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/235976.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用Pytorch从零开始实现CLIP

生成式建模知识回顾: [1] 生成式建模概述 [2] Transformer I,Transformer II [3] 变分自编码器 [4] 生成对抗网络,高级生成对抗网络 I,高级生成对抗网络 II [5] 自回归模型 [6] 归一化流模型 [7] 基于能量的模型 [8] 扩散模型 I, 扩散模型 II…

Spring Security 的使用

一、简介 1.1、Spring Security 相关概念 1.过滤器链(Filter Chain) 基于Servlet过滤器(Filter)处理和拦截请求,进行身份验证、授权等安全操作。过滤器链按顺序执行,每个过滤器负责一个具体的安全功能。 …

【经验分享】openGauss 客户端(Data Studio / DBeaver)连接方式

前言 本篇介绍了openGauss常用的客户端连接工具Data Studio和DBeaver 01 客户端工具 openGauss部署之后,在服务器上提供了在命令行下运行的数据库连接工具gsql。此工具除了具备操作数据库的基本功能,还提供了若干高级特性,便于用户使用。…

【Node.js】笔记整理 5 - Express框架

写在最前:跟着视频学习只是为了在新手期快速入门。想要学习全面、进阶的知识,需要格外注重实战和官方技术文档,文档建议作为手册使用 系列文章 【Node.js】笔记整理 1 - 基础知识【Node.js】笔记整理 2 - 常用模块【Node.js】笔记整理 3 - n…

qt5.15播放音频示例(4种方法)

文章目录 Qt播放音频方法一 QMediaPlayer方法二 QSound方法三 QSoundEffect方法四 QAudioOutput问题1 播放无声问题2 QAudioOutput播放嗡嗡声的问题参考Qt播放音频 在linux系统中,可以通过aplay进行简单的播放音频,如 aplay /opt/Audio/test.wav在图形界面,也可以封装apla…

玩转大数据:3-Hadoop家族的力量与挑战

引言 Hadoop作为一个强大的大数据处理框架,以其分布式计算和存储能力在业界备受关注。然而,Hadoop在应用场景、适用范围、社区支持以及后续持续发展等方面也面临着一些挑战。本文将围绕Hadoop的生态应用,以及来自其他生态的挑战,…

【排序,直接插入排序 折半插入排序 希尔插入排序】

文章目录 排序排序方法的分类插入排序直接插入排序折半插入排序希尔插入排序 排序 将一组杂乱无章的数据按照一定规律排列起来。将无序序列排成一个有序序列。 排序方法的分类 储存介质: 内部排序:数据量不大,数据在内存,无需…

leetcode 18. 四数之和(优质解法)

代码&#xff1a; class Solution {public List<List<Integer>> fourSum(int[] nums, int target) {List<List<Integer>> listsnew ArrayList<>();int lengthnums.length;Arrays.sort(nums);for(int i0;i<length-4;){for(int ji1;j<lengt…

【ArcGIS Pro二次开发】:CC工具箱1.1.4更新_免费_50+工具

CC工具箱1.1.4更新【2023.11.30】 使用环境要求&#xff1a;ArcGIS Pro 3.0 一、下载链接 工具安装文件及使用文档&#xff1a; https://pan.baidu.com/s/1OJmO6IPtMfX_vob3bMtvEg?pwduh5rhttps://pan.baidu.com/s/1OJmO6IPtMfX_vob3bMtvEg?pwduh5r 二、使用方法 1、在下…

抖音本地生活服务商申请条件

抖音的本地生活服务商目前有两种&#xff0c;一种是可以做全国的服务商&#xff0c;我们一般叫抖音本地生活服务商&#xff0c;一种是区域优待服务商&#xff0c;也就是后面出来的服务商&#xff0c;这两种服务商的申请方式大同小异。 相同的地方就是都需要给平台交保证金。抖…

Go语言 值传递

官方说法&#xff0c;Go中只有值传递&#xff0c;没有引用传递 而Go语言中的一些让你觉得它是引用传递的原因&#xff0c;是因为Go语言有值类型和引用类型&#xff0c;但是它们都是值传递。 值类型 有int、float、bool、string、array、sturct等 引用类型有slice&#xff0c…

FlatLaf:干净、优雅、扁平化,基于java swing现代开源跨平台外观

一个很不错的java swing ui库&#xff0c;idea主题风格&#xff0c;还能自定义 FlatLaf是用于JavaSwing 桌面应用程序的现代开源跨平台外观。 它看起来几乎是平的&#xff08;没有阴影或渐变&#xff09;、干净、简单和优雅。FlatLaf带有Light、Dark、IntelliJ和Darcula主题&a…