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

electron TodoList网页应用打包成linux deb、AppImage应用

这里用的是windows的wsl的ubuntu环境
在这里插入图片描述electron应用打包linux应用需要linux下打包,这里用windows的wsl的ubuntu环境进行操作

1)linux ubuntu安装nodejs、electron

安装nodejs:

sudo apt update
sudo apt upgrade
##快捷安装
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt-get install -y nodejs

安装完验证
在这里插入图片描述

安装electron:

##安装cnpm
sudo npm install -g cnpm --registry=https://registry.npmmirror.com
cnpm install --save-dev electron
cnpm install electron-builder --save-dev

在这里插入图片描述

2、electron打包linux应用

参考:
TodoList网页:https://cnloong.blog.csdn.net/article/details/140648621

TodoList打包文件夹内容基本都是上面和windows打包exe一样,只更改了package.json文件
在这里插入图片描述

新package.json内容:
linux下需要author、homepage、maintainer参数,不然会报错

{"name": "todolist-app","version": "1.0.0","main": "main.js","homepage": "https://example.com","author": {"name": "Your Name","email": "your.email@example.com"},"build": {"appId": "com.yourcompany.todolist","mac": {"category": "public.app-category.productivity"},"win": {"icon": "icons/icon.png","target": ["nsis"]},"linux": {"target": ["AppImage","deb"],"category": "Utility","maintainer": "Your Name <your.email@example.com>"} },"scripts": {"start": "electron .","build": "electron-builder --linux"},"keywords": [],"license": "ISC","description": "","devDependencies": {"electron": "^31.2.1","electron-builder": "^24.13.3"},"dependencies": {}
}

打包过程:
1)在windows的wsl的ubuntu环境进入对应windows目录TodoList下
一般/mnt下就是映射的windows的目录

在这里插入图片描述
在这里插入图片描述
2)build

npm run build

在这里插入图片描述
3)打包完成
在dist文件夹下可以看到linux平台的deb、AppImage安装包
在这里插入图片描述
dist\linux-unpacked 下是免安装包
在这里插入图片描述

ubuntu桌面查看

直接cmd进入linux-unpacked 目录下执行

./todolist-app --no-sandbox

如果不加–no-sandbox会报错
在这里插入图片描述

在这里插入图片描述
TodoList 运行效果

在这里插入图片描述

http://www.lryc.cn/news/407279.html

相关文章:

  • 【C语言】 使用fgets和fputs完成两个文件的拷贝
  • 使用PyTorch导出JIT模型:C++ API与libtorch实战
  • Python——异常捕获,传递及其抛出操作
  • 【Maven】 的继承机制
  • 微信小程序结合后端php发送模版消息
  • sqlalchemy报错sqlalchemy.orm.exc.DetachedInstanceError
  • 华为网络模拟器eNSP安装部署教程
  • 【React】详解样式控制:从基础到进阶应用的全面指南
  • 【ROS2】高级:安全-理解安全密钥库
  • C语言 ——— 数组指针的定义 数组指针的使用
  • opencascade AIS_ManipulatorOwner AIS_MediaPlayer源码学习
  • 如何防止用户通过打印功能复制页面文字
  • Python3网络爬虫开发实战(3)网页数据的解析提取
  • 基于 HTML+ECharts 实现监控平台数据可视化大屏(含源码)
  • 立创梁山派--移植开源的SFUD和FATFS实现SPI-FLASH文件系统
  • MySQL之视图和索引实战
  • 快速参考:用C# Selenium实现浏览器窗口缩放的步骤
  • MyBatis 插件机制、分页插件如何实现的
  • CentOS6.0安装telnet-server启用telnet服务
  • H5+CSS+JS工作性价比计算器
  • Linux:基础命令学习
  • 遇到Websocket就不会测了?别慌,学会这个Jmeter插件轻松解决....
  • 高性能 Java 本地缓存 Caffeine 框架介绍及在 SpringBoot 中的使用
  • Http 和 Https 的区别(图文详解)
  • DP学习——外观模式
  • Vue3 + Vite 打包引入图片错误
  • 搭建NFS、web、dns服务器
  • C++的UI框架和开源项目介绍
  • SpringBoot连接PostgreSQL+MybatisPlus入门案例
  • vue3里将table表格中的数据导出为excel