您的位置:首页 > 教育 > 培训 > electron: 将网址打包成exe桌面应用

electron: 将网址打包成exe桌面应用

2024/10/6 1:36:53 来源:https://blog.csdn.net/weixin_44565776/article/details/142092161  浏览:    关键词:electron: 将网址打包成exe桌面应用

项目场景:

在项目开发的过程中,需要将应用搭建在不同的硬件上。如需要在一个触屏显示器上展示企业相关的应用。

如果专门去开发一个这样的应用,不划算;这时候考虑将网址打包成exe应用,并安装触屏器上,就可以满足客户的需求。

项目就是为了特定的目的,消耗一定的资源,在确定的时间内,提供特定的产品。同时也要注意,产品不一样要最好的,但是一定要是合适的,满足客户需求的。


解决方案

目前主要解决方案有三种:一种是让第三方进行打包,还有一种是用Nativefier, 最后一种是用electron进行打包。

首先用第三方打包,优点是方便,确定是要花钱。

其次是Nativefier,这个可以下载对应的应用,然后用命令的方式直接打包,优点是免费,方便,缺点是logo设置优点麻烦,一般只能在本地使用,不能给其他人安装,不然logo容易丢失。以下是自己用Nativefier进行打包的教程。

https://blog.csdn.net/weixin_44565776/article/details/139435103

最后一种是用electron进行打包,优点是方便,并且可以随意转发给其它人安装使用,缺点是logo需要特定的尺寸,一般为256*256,推荐格式是ico格式,打包有点麻烦。

最终我选择了最后一种方案。因为便宜又好用。


代码实施:

nodejs版本:20.10.0

因为在下载electron的过程中,需要在29.1.6以上版本,所以在下载时要注意;以下是package.json的代码,可以按照这个包进行下载安装。

{"name": "electron-app","version": "1.0.0","description": "","main": "index.js","scripts": {"start": "electron-forge start","build": "electron-builder --win",  "test": "echo \"Error: no test specified\" && exit 1"},"build": {"productName": "百度",//打包应用名称"directories": {"output": "out" },"win": {"icon": "./icon/favicon.ico","target": [{"target": "nsis","arch": ["x64","ia32"]}]},"nsis": {"oneClick": false,"allowElevation": true,"allowToChangeInstallationDirectory": true,"installerIcon": "./icon/favicon.ico",//打包logo"uninstallerIcon": "./icon/favicon.ico",//打包logo"installerHeaderIcon": "./icon/favicon.ico",//打包logo 以上lkogo推荐用一个"createDesktopShortcut": true,"createStartMenuShortcut": true,"shortcutName": "百度"//打包应用名称}},"keywords": [],"author": "","license": "ISC","devDependencies": {"@electron-forge/cli": "^7.4.0","electron": "^29.1.6","electron-builder": "^24.13.3"}
}

以下是index.js的代码:

const { app, BrowserWindow } = require('electron')
const createWindow = () => {// 创建浏览器窗口const win = new BrowserWindow({autoHideMenuBar: true,})// 全屏win.maximize()// 载入要打包的网页链接win.loadURL('https://www.baidu.com/')
}// 应用程序准备好后加载窗口
app.whenReady().then(() => {createWindow()app.on('activate', () => {if (BrowserWindow.getAllWindows().length === 0) createWindow()})
})// 窗口关闭后退出应用程序
app.on('window-all-closed', () => {if (process.platform !== 'darwin') app.quit()
})

有以上两块核心代码,然后自己创建一个。


收获:

在运用这个应用我给多位客户打包过网址,并还赚了几百大洋的零花钱。

如果你需要网址打包,可以@我哈!

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com