SinF的Electron系列之三—electron-packager載入第三方資源

SinF發表於2019-02-16
Package

在上篇SinF的Electron系列之二裡我提到了，用–extra-resource欄位來載入第三方資源。

在專案開始的時候，我把第三方資源放到了根目錄的static資料夾裡，發現並沒有起到載入第三方資源的效果。通用查詢，發現electron-packager提供–extra-resource欄位。

  • 核心方法，用 –extra-resource 欄位來儲存。用 path 模組來獲取絕對路徑。
  • 核心路徑，Resources資料夾

  • 具體使用方法，

    • 儲存程式碼如下：
         --extra-resource=./res/2.dat --extra-resource=./res/1.dat 
【注意】./res 是我在根目錄下面自定義的一個第三方資源目錄，可以任意修改。如果有多個第三方資源，可以重複新增。

  • 難點在於如何讀取，我以mac版本的打包檔案為例

    • 右鍵進入app的檔案目錄，目錄如下：
        Contents
        │   ├── Framworks (electron框架檔案)
        │   ├── MacOS
        │   │   ├── 專案
        │   └── Resources（資源）
        │   │   └── electron.asar(打包後的執行檔案,asar格式即加密格式，只能通過node.js的fs模組解析)
        │   │   └── ...(其他資源)
        │   │   └── 1.dat
        │   │   └── 2.dat
    • 通過分析檔案結構可以知道，我們打包後的執行檔案，在 Resources 檔案中，項的electron.asar包裡。而第三方檔案被放置到了 Resources 根目錄下，所以 載入第三方資源 可以轉換為，獲取Resources資料夾中的資源

    • 常用的“../”這裡是不行的，需要用的 node.js 中的 path模組，程式碼如下：

      const url = path.resolve(__dirname, `..`)
this.datUrl = url + `/1.dat`

      其中： path.resolve(__dirname, `..`)表示當前目錄的父目錄的絕對路徑，即Resource 目錄的絕對路徑

      • 這樣，就可以獲取到第三方檔案了。

相關文章