当前位置: 首页 > article >正文

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()
})

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


收获:

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

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


http://www.kler.cn/a/299906.html

相关文章:

  • 【中间件快速入门】什么是Redis
  • 【机器学习】自定义数据集使用框架的线性回归方法对其进行拟合
  • PyQt6医疗多模态大语言模型(MLLM)实用系统框架构建初探(下.代码部分)
  • 【esp32-uniapp】uniapp小程序篇02——引入组件库
  • 技术之翼,创作之心
  • 【工程篇】01:GPU可用测试代码
  • Android Dialog:Dialog和DialogFragment的区别?DialogFragment如何使用?源码解析
  • 解锁10款超棒的图表制作软件,让数据可视化不再困难
  • leetcode 994.腐烂的橘子
  • Django-Celery-Flower实现异步和定时爬虫及其监控邮件告警
  • 【HCIA-Datacom】数据通信网络基础
  • CSS“多列布局”(补充)——WEB开发系列35
  • 网络层 VII(IP多播、移动IP)【★★★★★★】
  • 【C++】——string
  • 揭开面纱--机器学习
  • Ubuntu创建一个虚拟摄像头
  • 【区块链 + 基层治理】链动社区:基于 FISCO BCOS 的智慧社区数字化治理平台 | FISCO BCOS应用案例
  • QQ频道机器人零基础开发详解(基于QQ官方机器人文档)[第二期]
  • Java System.getenv 和 System.getProperty 区别
  • DAY74
  • 【笔记】扩散模型(七):Latent Diffusion Models(Stable Diffusion)论文解读与代码实现
  • Flutter 中的低功耗蓝牙概述
  • 连锁管理系统如何兼批发和零售 连锁收银系统如何配合做好财务
  • C++之函数的分文件编写
  • ToDesk远程连接Ubuntu 2022.04,鼠标动不了,Windows自带的远程桌面连接也连不上,TightVNC Viewer也连不上的解决办法
  • vc-align源码分析 -- ant-design-vue系列