Electron-Builder 打包 Vue 项目避坑指南

{
  "name": "your-app",
  "version": "1.0.0",
  "description": "Your Vue.js Desktop App",
  "main": "index.js",
  "scripts": {
    "pack": "electron-builder --dir",
    "dist": "electron-builder"
  },
  "build": {
    "appId": "com.yourapp.id",
    "productName": "YourAppName",
    "directories": {
      "output": "dist"
    },
    "files": [
      "dist/**/*",
      "node_modules/**/*",
      "main.js"
    ],
    "win": {
      "target": "nsis"
    },
    "mac": {
      "target": "dmg"
    },
    "linux": {
      "target": [
        "AppImage",
        "deb"
      ]
    }
  },
  "dependencies": {
    "vue": "^2.6.11",
    "vue-router": "^3.1.3",
    // ...其他依赖
  },
  "devDependencies": {
    "electron": "^7.1.11",
    "electron-builder": "^20.43.0",
    // ...其他开发依赖
  }
}

这个示例配置文件展示了如何为 Electron 应用使用 electron-builder 打包 Vue.js 项目。其中，pack 脚本使用 --dir 参数仅输出打包目录，而 dist 脚本则进行最终的打包，生成可分发的安装文件。配置中指定了应用程序的标识、输出目录、包含的文件、以及不同平台的打包目标。