react + electron 完成后，用electron-bilder 打包安装， nsis 编写安装界面，要求界面有美观的图片封面（这个图片是我本地的），并且有安装进度条，每个进度条配置不同的图 怎么做，代码

首先，你需要安装 electron-builder 和 nsis：

npm install electron-builder --save-dev
npm install nsis --save-dev

然后，你可以在 package.json 文件中添加以下配置：

"build": {
  "productName": "Your App Name",
  "appId": "your.app.id",
  "directories": {
    "output": "build"
  },
  "files": [
    "dist/**/*",
    "node_modules/**/*",
    "src/assets/**/*" // 添加本地图片资源
  ],
  "nsis": {
    "oneClick": false,
    "allowElevation": true,
    "installerIcon": "src/assets/icon.ico",
    "uninstallerIcon": "src/assets/icon.ico",
    "installerHeaderIcon": "src/assets/icon.ico",
    "createDesktopShortcut": true,
    "createStartMenuShortcut": true,
    "shortcutName": "Your App Name",
    "license": "LICENSE.txt",
    "artifactName": "${productName} Setup ${version}.${ext}" // 安装文件名称
  },
  "win": {
    "target": [{
      "target": "nsis",
      "arch": [
        "x64",
        "ia32"
      ]
    }]
  }
}

在这个配置中，你需要注意以下几点：

- `"productName"`: 你的应用程序名称。
- `"appId"`: 你的应用程序的标识符。
- `"directories.output"`: 打包后的输出目录。
- `"files"`: 打包时需要包含的文件，包括你的本地图片资源。
- `"nsis"`: NSIS 配置选项，包括安装文件名称、图标、快捷方式等。
- `"win.target"`: 指定打包的目标平台和架构。

接下来，你需要在你的应用程序中添加进度条。你可以使用 Electron 中的 `ProgressBar` 类来实现。以下是一个简单的例子：

const { BrowserWindow, ProgressBar } = require('electron')

let mainWindow = null
let progressBar = null

function createWindow() {
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  })

  progressBar = new ProgressBar({
    text: 'Installing...',
    detail: 'Please wait...',
    browserWindow: {
      parent: mainWindow,
      modal: true,
      closable: false,
      minimizable: false,
      maximizable: false,
      resizable: false,
      width: 400,
      height: 100,
      webPreferences: {
        nodeIntegration: true
      }
    },
    style: {
      text: {
        color: '#fff',
        fontSize: '18px'
      },
      detail: {
        color: '#fff',
        fontSize: '14px'
      },
      bar: {
        background: '#63a4ff'
      }
    }
  })

  mainWindow.loadFile('index.html')
}

// 打包结束后执行
builder.on('afterPack', async (context) => {
  // 模拟安装过程
  const total = 10
  for (let i = 0; i < total; i++) {
    progressBar.value = (i / total) * 100
    await new Promise(resolve => setTimeout(resolve, 500))
  }
  progressBar.close()
})

app.whenReady().then(() => {
  createWindow()
})

在这个例子中，我们创建了一个名为 `progressBar` 的进度条，并在打包结束后模拟了一个安装过程。在实际使用中，你需要根据你的实际需求来修改这个例子。

最后，你可以使用以下命令来打包你的应用程序：

npm run build

如果一切顺利，你将得到一个安装文件和一个可执行文件，同时打包过程中会显示你的进度条。