electron-builder打包指定資源到安裝目錄

問題場景：

最近項目遇到一個需求，Electron應用，要在本地給客戶提供一個文件上傳模板，在非聯網環境下，用戶可經過Electron應用下載該模板，進行本地保存。
因而涉及到兩個問題：
-1.如何把模板文件打包到Electron應用的安裝目錄中
-2.Electron應用運行時，如何訪問到該文件模板資源

看了好多文章，仍是沒有找到一個很清晰的答案，後來摸索試驗成功了，在此記錄一下，但願對你有幫助，因爲項目使用的是electron-builder打包器來打包的，這裏主要針對electron-builder打包配置來說解。

解決方案

下面是經常使用的electron-builder打包配置
package.json文件

{
  "name": "demo",
  "version": "0.0.1",
  "build": {  // electron-builder配置
    "productName":"xxxx",//項目名 這也是生成的exe文件的前綴名
    "appId": "xxxxx",//包名  
    "copyright":"xxxx",//版權  信息
    "compression": "store", // "store" | "normal"| "maximum" 打包壓縮狀況(store 相對較快)，store 39749kb, maximum 39186kb
    "directories": {
        "output": "build" // 輸出文件夾
    }, 
    "asar": false, // asar打包
    "extraResources":  { // 拷貝dll等靜態文件到指定位置
        "from": "./extraResources/",
        "to": "extraResources"
    },
    "win": {  
       "icon": "build/icons/icon.ico",//圖標路徑
        "target": [
          {
            "target": "nsis",
            "arch": [
              "ia32"
            ]
          }
        ]
    },
    "nsis": {
        "oneClick": false, // 一鍵安裝
        "guid": "xxxx", //註冊表名字，不推薦修改
        "perMachine": true, // 是否開啓安裝時權限限制（此電腦或當前用戶）
        "allowElevation": true, // 容許請求提高。 若是爲false，則用戶必須使用提高的權限從新啓動安裝程序。
        "allowToChangeInstallationDirectory": true, // 容許修改安裝目錄
        "installerIcon": "./build/icons/aaa.ico", // 安裝圖標
        "uninstallerIcon": "./build/icons/bbb.ico", //卸載圖標
        "installerHeaderIcon": "./build/icons/aaa.ico", // 安裝時頭部圖標
        "createDesktopShortcut": true, // 建立桌面圖標
        "createStartMenuShortcut": true, // 建立開始菜單圖標
        "shortcutName": "xxxx" // 圖標名稱
    }
  }
}

回到開始的問題：

1.如何把模板文件打包到Electron應用的安裝目錄中
答：在package.json文件中 extraResources配置項作了說明「拷貝dll等靜態文件到指定位置」，
from和to表示從哪移到哪兒，'./'指向存放package.json的同級目錄，如圖所示：

在項目根目錄下新建extraResources文件夾用於存放模板資源文件，即配置中from的來源，
打包後，則在app的兄弟目錄下生成extraResources文件夾，即配置中to的定義的名稱，並存入來自from的模板文件，以下圖：

2.Electron應用運行時，如何訪問到該文件模板資源
答：使用 process.cwd() 便可獲取到，當前程序的運行路徑如 C:\Users\administrator\AppData\Local\Programs\應用名，文件路徑爲

import path from 'path'
let templateFilePath = path.join(process.cwd(), '/resources/extraResources','template.zip')
if (process.env.NODE_ENV === 'development') {
  templateFilePath = path.join(process.cwd(), '/extraResources','template.zip')
}
console.log(templateFilePath )