與電子鏈接的msi安裝程序

Question

我是Electron的新手，我正在構建一個我想在Windows上安裝的應用程序。 我閱讀了有關如何在Electron的文檔中分發您的應用程序的文檔 ，我知道：

electron-forge
electron-builder
electron-packager

目前我正在與：

"electron-builder-squirrel-windows": "^19.20.0",
"electron-builder": "^19.20.0",
"electron": "^1.6.11"

鑒於此，我能夠創建一個Setup.exe來安裝我的應用程序，但我無法為安裝過程創建任何UI。

我想讓用戶選擇如果他需要更改安裝路徑，顯示我希望他接受的最終許可證，...

沒有關於electron.atom.io的信息

看看使用Electron構建的Atom編輯器或Slack ，我可以看到在安裝過程中可以顯示一些UI。 這通常是怎么做的？

編輯：我剛剛閱讀了關於windows-installer的信息 ，您需要為此Edit Edit使用squirrel事件：

• 將標題更改為“使用電子鏈接的msi安裝程序”

請注意，安裝程序第一次啟動您的應用時，您的應用會看到--squirrel-firstrun標志。 這允許您執行諸如顯示啟動畫面或顯示設置UI之類的操作。

Answer 1

作為使用整個電子包堆棧開發Windows MSI安裝交付的替代方法，您可以考慮使用以下機制作為另一種有用的解決方案：

1. webpack - 構建可分發的應用程序客戶端
2. electron-packager - 構建您的電子二進制文件（在本例中為Windows）
3. WiX工具集 - 用於構建Windows MSI安裝程序。

當然，無論您選擇使用哪種安裝程序，都必須執行步驟1和步驟2。 我發現webpack是最穩定，可配置和完整的解決方案，用於打包角度Web應用程序（這是我的工作），而electron-packager是你無法實現的一個工具，如果你想實際為您的應用構建平台特定的二進制文件。

在我們的例子中，我使用gulp腳本來包裝webpack和electron-packager模塊，這是我為了通過他們的API，而不是他們的命令行衍生打電話，以保持他們在便於維護和錯誤處理的構建過程中保持一致的JavaScript上下文（命令行解決方案比javascript，imo中的包，模塊，文件和函數更難以擴展和重新定位）。

通過了解我所指的項目類型，可以更容易地解釋這一點。 具體而言，如果您要構建具有完整項目結構的電子應用程序，例如：

C:.
+---assets/
+---ClientSide
¦   +---index.html
¦   +---app
¦   ¦   +---app.component.ts
¦   ¦   +---app.module.ts
¦   ¦   +---main.ts
¦   ¦   +---AppContent/
¦   ¦   +---help/
¦   ¦   +---modals/
¦   ¦   +---panels/
¦   ¦   +---shared/
¦   +---Styles
¦   ¦   +---dist/
¦   ¦   +---svgs/
¦   +---test
¦       +---AppContent/
¦       +---modals/
¦       +---panels/
¦       +---shared/
+---dist/
+---edist
|   \---Application-win32-ia32 [*location of binary source for the install]
+---ServerSide
¦   +---app.js
¦   +---server.js
¦   +---test/
+---Installer
    +---buildMSI.bat
    +---Application/

gulpfile.js
karma.conf.js
main.js
package.json
README.md
webpack.config.js

這種結構顯示了一個項目，其中包含您在真實開發環境中所需的所有部分，例如webpack，配置，業力（客戶端測試），用於打包操作的gulp（webpack的包裝操作，電子打包器），窗口用於運行WiX命令的批處理文件等。

這種方法的流程（可能記錄在您的README.md中）類似於新用戶設置和構建項目的這些步驟：

1. git clone <project/path> - 將repo克隆到本地計算機
2. npm install - 加載/安裝node_modules
3. gulp lint - 驗證代碼並生成CI結果。 （你選擇的短絨）
4. gulp test - 運行服務器端和客戶端單元測試，為每個測試生成代碼覆蓋CI結果
5. gulp build_web_client - 使用webpack API調用構建客戶端Web項目。 這應該會在項目下創建一個名為“dist”的目錄
6. gulp build_electron_app - 使用electron-packager API構建Electron可執行文件。 這應該會在項目下創建一個名為“edist”的目錄。
7. cd Installer
8. buildMSI.bat - 此Windows批處理腳本應執行以下步驟：
   1. 通過使用Wix命令heat.exe / edist目錄的內容列表（在上面的目錄樹結構中看到並由步驟6創建）來准備清單文件（生成.wxs文件）
   2. 使用Wix命令candle.exe預處理並將項目編譯為對象（.wixobj）
   3. 使用Wix命令Light.exe將Wix項目鏈接到其最終可安裝文件格式，生成安裝MSI文件。

這只是一個建議。 當然，您可以根據自己的選擇使用其他工具。 這只是我發現的一種方法，可用於開發用於部署到Windows目標的電子應用程序。 關於這一點的好處是，使用Electron，您可以選擇構建到許多目標操作系統，使用步驟1-6，然后如果您想要轉到Windows或Mac，Linux執行步驟7和8，則可以選擇不同的部署方法。

是的，確實如此，你可以使用electron-builder （或者那些有簡單需求的electron-forge ）來通過Squirrel打包你的應用程序，作為部署到所有電子操作系統的方式（這意味着要取代我的步驟7和8）與那些包裝替代品）。 根據我的經驗和我們的上下文，Squirrel解決Windows部署似乎不如使用Wix進行部署。

關於您對安裝的可配置性的原始問題，使用Wix的好處是您可以使用它來完全自定義您的安裝UI和體驗（包括目標路徑）。

Answer 2

使用Squirrel時，無法在Windows上選擇安裝路徑。 它似乎也不存在。 他們不想支持這一點。 看到這里和這里 。