react +electron 开发桌面端结束后打包成可安装软件详细教程

好的，下面是详细的步骤：

1. 安装electron-builder

electron-builder是一个打包electron应用程序的工具，我们需要先全局安装它：

npm install electron-builder -g

2. 配置package.json

在package.json文件中添加以下内容：

"build": {
  "productName": "Your App Name",
  "appId": "com.yourcompany.yourappname",
  "directories": {
    "output": "build"
  },
  "files": [
    "dist/**/*",
    "public/**/*",
    "main.js",
    "package.json"
  ],
  "mac": {
    "category": "your.app.category.type",
    "icon": "build/icon.icns"
  },
  "win": {
    "target": "nsis",
    "icon": "build/icon.ico"
  }
}

其中，productName是你的应用程序名称，appId是应用程序的唯一标识符，directories.output是打包后输出的目录，files是需要打包的文件列表，mac和win是分别针对macOS和Windows系统的配置。

3. 添加打包脚本

在package.json文件中添加以下脚本：

"scripts": {
  "build": "electron-builder"
}

这个脚本将会执行electron-builder来打包应用程序。

4. 执行打包命令

在终端中执行以下命令：

npm run build

这个命令将会执行electron-builder来打包应用程序，打包完成后，你将会在directories.output中看到生成的安装程序。

5. 安装并运行应用程序

双击安装程序进行安装，安装完成后，你就可以在应用程序列表中找到你的应用程序并运行了。

希望这个教程能够帮助到你，祝你成功！