electron-builder添加自定義安裝卸載界面


electron-builder 官方文檔 :https://www.electron.build/configuration/nsis#NsisOptions-script

添加自定義安裝卸載界面需要在 builderOptions 中添加 include 腳本

添加 include 腳本

nsis 腳本 在 node_modules\app-builder-lib\templates\nsis 中被引入,所以這里寫的腳本都會進到最終 nsis 的腳本中

nsis 腳本官方文檔 :https://nsis.sourceforge.io/Docs

1.在 build\nsis 添加 uninstaller.nsh

我在做用戶卸載界面所以叫 uninstaller , 這個可以隨意叫

!include nsDialogs.nsh

XPStyle on
# 此卸載腳本在原有基礎上添加指定義卸載頁面 用於顯示提示用戶刪除用戶數據
Var /GLOBAL Dialog_1
; Var /GLOBAL HLine
Var /GLOBAL VLine
; Var /GLOBAL Text_1
Var /GLOBAL Label_1
Var /GLOBAL Label_2
Var /GLOBAL CheckBox_1
Var /GLOBAL Checkbox_State

# 創建自定義卸載頁面
UninstPage custom un.nsDialogsPage un.nsDialogsPageLeave
Function un.nsDialogsPage
	nsDialogs::Create 1018
	Pop $Dialog_1
	${If} $Dialog_1 == error
		Abort
	${EndIf}
	${NSD_CreateVLine} 0 30u 100% 12u ""
	Pop $VLine
	${NSD_CreateLabel} 0 10u 100% 12u "卸載提示:是否本地刪除用戶數據?"
	Pop $Label_1
	${NSD_CreateLabel} 10u 30u 100% 12u "保留用戶數據可在重新安裝后找回以往配置方案"
	Pop $Label_2
	${NSD_CreateCheckbox} 0 50u 100% 10u "&確認刪除本地用戶數據"
	Pop $CheckBox_1
	nsDialogs::Show
FunctionEnd
Function un.nsDialogsPageLeave
${NSD_GetState} $CheckBox_1 $Checkbox_State
	 ; MessageBox MB_OK "You checked:$\n$\n   CheckBox_1 $CheckBox_1 $\n$\n  Checkbox_State $Checkbox_State   $\n$\n  BST_CHECKED ${BST_CHECKED} $\n$\n BST_UNCHECKED ${BST_UNCHECKED}"  #MessageBox用於調試
FunctionEnd

Section
SectionEnd


!macro customUnInstall
; 卸載過程執行
    ${ifNot} ${isUpdated}
      # 提示窗
        ${If} $Checkbox_State == ${BST_CHECKED}
          # 如果勾選刪除固定文件夾(測試版)
          MessageBox MB_OKCANCEL "是否確認刪除用戶數據?" IDOK label_ok  IDCANCEL  label_cancel
          label_ok:
              # 刪除固定文件夾
              RMDir /r $PROFILE\iConfig_TEST
              Goto end
          label_cancel:
              Goto end
          end:
        ${EndIf}
    ${endIf}
!macroend

關於自定義頁面的官方文檔:https://nsis.sourceforge.io/Docs/Modern UI 2/Readme.html

參考這段

Custom pages
If you want add your custom pages to your installer, you can insert your own page commands between the page macros.

!insertmacro MUI_PAGE_WELCOME
Page custom FunctionName ;Custom page
!insertmacro MUI_PAGE_COMPONENTS

;Uninstaller
!insertmacro MUI_UNPAGE_CONFIRM
UninstPage custom un.FunctionName ;Custom page
!insertmacro MUI_UNPAGE_INSTFILES
Use the MUI_HEADER_TEXT macro to set the text on the page header in a page function:

LangString PAGE_TITLE ${LANG_ENGLISH} "Title"
LangString PAGE_SUBTITLE ${LANG_ENGLISH} "Subtitle"

Function CustomPageFunction
  !insertmacro MUI_HEADER_TEXT $(PAGE_TITLE) $(PAGE_SUBTITLE)
  nsDialogs::...
  ...
FunctionEnd

使用 nsDialogs 創建自定義界面, nsDialogs 的詳細文檔:https://nsis.sourceforge.io/Docs/nsDialogs/Readme.html

2.修改 builderOptions 配置

我用的 vue-electron 所以在 vue.config.js 中配置

 builderOptions: {
		...
        nsis: {
          ...
          warningsAsErrors: false ,// nsis警告變錯誤(防止警告變成報錯無法打包)
          include: 'build/nsis/uninstaller.nsh', // NSIS包含定制安裝程序腳本的路徑

        }
      }

注意事項

如果 include 像我一樣添加的是卸載頁面,會報錯:warning 6020: Uninstaller script code found but WriteUninstaller never used - no uninstaller will be

雖然只是警告 但是 編譯時默認使用/WX (將警告視為錯誤 warningsAsErrorstrue(默認) ),導致打包中斷。

因為一直沒有找到對應 WriteUninstaller 應該寫在哪,而且改 node_modules 中的源碼也不太好,干脆不讓警告視為錯誤,

修改 warningsAsErrors = false

預定義宏

關於 include 腳本 還可以添加預定好的宏 ,下面是例子 可以自己在中添加需要執行的代碼

; include 腳本 用於在安裝和卸載的各個階段做一些事情
; ${BUILD_RESOURCES_DIR} 默認為項目目錄下的 build 目錄
; ==============================================================================
; !macro preInit
; ; 安裝時最早執行0
;   ; This macro is inserted at the beginning of the NSIS .OnInit callback
;   MessageBox MB_OK  "${BUILD_RESOURCES_DIR}/preInit" IDOK
; !macroend
; ==============================================================================
; !macro customInit
; ; 安裝時其次執行1
;   MessageBox MB_OK  "${BUILD_RESOURCES_DIR}/customInit" IDOK
; !macroend
; ==============================================================================
; # 卸載
; !macro customHeader
; ; 安裝時其次執行3
      ; MessageBox MB_OK  "${BUILD_RESOURCES_DIR}/customHeader" IDOK
; !macroend
; ==============================================================================
; !macro customInstall
; ; 安裝時其次執行4
;   MessageBox MB_OK  "${BUILD_RESOURCES_DIR}/customInstall" IDOK
; !macroend
; ==============================================================================
; !macro customUnInit
;; 卸載頁面出現前執行
;     # 提示窗
        ;  MessageBox MB_OKCANCEL "是否刪除用戶數據?" IDOK label_ok  IDCANCEL  label_cancel
        ;  label_ok:
        ;     # 刪除固定文件夾
        ;      RMDir /r $PROFILE\iConfig_TEST
        ;      Goto end
        ;  label_cancel:
        ;      Goto end
        ;  end:
; !macroend
; ==============================================================================
;  !macro customUnInstall
;  ; 卸載過程執行
;      ${ifNot} ${isUpdated}
;         # 提示窗
;          MessageBox MB_OKCANCEL "是否刪除用戶數據?" IDOK label_ok  IDCANCEL  label_cancel
;          label_ok:
;             # 刪除固定文件夾
;              RMDir /r $PROFILE\iConfig_TEST
;              Goto end
;          label_cancel:
;              Goto end
;          end:
;      ${endIf}
;  !macroend
; ==============================================================================
; !macro customInstallMode
;    ; 安裝和卸載時都執行用於設定安裝用戶
;   # set  $isForceMachineInstall (給機器的每個用戶都安裝) or $isForceCurrentInstall (給當前用戶安裝)
;   # to enforce one or the other modes.
;     ; StrCpy $isForceMachineInstall "1"
;     MessageBox MB_OK  "${BUILD_RESOURCES_DIR}/customInstallMode" IDOK
; !macroend
; ==============================================================================
; !macro customRemoveFiles
; ; 當刪除文件時執行(重新安裝和卸載都執行)
;     ; Section  /o "是否刪除用戶數據"
;     ; MessageBox MB_OK  "${BUILD_RESOURCES_DIR}/NSISDemo" IDOK
;     ; SectionEnd
;     MessageBox MB_OK  "${BUILD_RESOURCES_DIR}/customRemoveFiles" IDOK
;   # set $isForceMachineInstall or $isForceCurrentInstall
;   # to enforce one or the other modes.
; !macroend
; ==============================================================================

如果要做卸載后表單選項 也可以用以上界面 添加對應的表單控件在 dialog 中,和發送地址即可


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM