electron项目国产操作系统适配

原创

已于 2024-12-03 22:22:10 修改 · 4k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #electron

于 2023-04-21 11:03:36 首次发布

本文详细介绍了如何在国产操作系统上配置electron项目的开发环境，包括安装npm、node.js、vue-cli和vscode。在安装过程中，解决权限问题的方法也被提及。在打包环节，特别指出了在linux系统中图标格式的要求、加载URL的特定形式，以及package.json的必要配置。此外，文章还讨论了软件更新策略，强调了在不同系统如Windows和Linux上版本升级的区别。

文章目录

- 一、安装npm、node.js、vue-cli、vscode等开发环境及工具
- 二、linux系统打包注意事项

Electron在Windows系统下不支持打包，需要在linux虚拟机或直接在linux系统中进行打包。
本次打包是在银河麒麟X86框架中进行的，需要自行安装npm、node.js、vue-cli、vscode等开发环境及工具。
本文档也介绍了在X86框架服务器中打包适配arm64框架的安装包。

一、安装npm、node.js、vue-cli、vscode等开发环境及工具

1、安装npm：

sudo apt install npm

2、安装node.js：

sudo apt install node

3、安装vue-cli脚手架：

sudo npm install -g @vue/cli

4、安装vscode：在商店里搜索直接安装

注意：
安装好以上环境后在vscode中运行项目，可能会出现报错：vue-cli-service: Permission denied
解决方法：
a、进入node_modules/.bin/
b、执行指令：ll，查看一下会发现该文件“vue-cli-service" 并没有可执行权限
c、更改权限，指令：chmod -R 755 ./*

二、linux系统打包注意事项

1、vue.config.js中linux设置中图标需是png格式，如果桌面图标不显示，需要设置desktop属性指定图片路径

"linux": {
   
   
	"target": "deb",  // X86框架
	// "target": [
    //     {
   
   
    //         "target": "deb",
    //         "arch": ["armv7l", "arm64"]
    //     }
    // ], // arm64框架
	"icon": "public/img/256x256.png",
	"category": "Development",<