使用的配置

{
    "name": "web",
    "version": "1.8.0",
    "private": true,
    "homepage": "./",
    "main": "main.js",
    "scripts": {
        "serve": "vue-cli-service serve --open",
        "start": "yarn serve",
        "build": "vue-cli-service build",
        "electron-start": "electron .",
        "package": "electron-builder --publish never --win",
        "package:linux": "electron-builder --publish never --linux",
        "dev": "concurrently \"wait-on http://localhost:8080 && electron .\" \"cross-env BROWSER=none yarn start\""
    },
    "dependencies": {},
    "devDependencies": {
        "electron": "^8.2.1",
        "electron-builder": "21.2.0"
    },
    "build": {
        "appId": "Electron-desktop",
        "productName": "Electron-desktop",
        "copyright": "",
        "directories": {
            "output": "build"
        },
        "win": {
            "target": [
                "nsis"
            ],
            "icon": "./dist/image/GuangFu.ico"
        },
        "linux": {
            "target": [
                "AppImage"
            ]
        },
        "extends": null,
        "asar": true,
        "nsis": {
            "oneClick": false,
            "allowToChangeInstallationDirectory": true,
            "installerHeaderIcon": "./dist/image/HDLogo.ico",
            "installerIcon": "./dist/image/HuoDian.ico",
            "createDesktopShortcut": true
        }
    }
}

vue/react 项目桌面端

打包的流程是先将项目编译成生产版本，然后将打包后的生产版本再打包成桌面客户端

遇到问题及解决方法

• 项目路径含有中文字符，打包失败

  electron-builder-err2_LI.jpg

• 在 windows 平台上打包 linux 失败，将项目迁移到 linux 环境上打包是成功

• electron 打包太慢

  打包过程需要下载相应的文件导致，可以提前下载好对应的文件并存到对应的位置中。参考

• 在 linux 上打包后缀为.AppImage的文件成功后，双击不能正常执行。使用命令行 ./*.AppImage 执行后显示 Running as root without --no-sandbox is not supported的错误。

  • 方案一：命令行追加 -no-sandbox执行
  • 方案二：当前用户是否是 root 用户，若是 root 用户请切换到其他的普通用户，并给予相应权限（root 用户貌似不支持 sandbox）