目    錄
第1章  構建第1個Electron應用程序 1
1.1  技術需求 1
1.2  Electron是什麼 1
1.3  準備開發環境 2
1.3.1  安裝Visual Studio Code 2
1.3.2  針對macOS設置環境 3
1.3.3  針對Ubuntu Linux設置環境 5
1.3.4  針對Windows設置環境 6
1.3.5  在Windows上安裝Node.js 7
1.4  創建一個簡單的應用程序 8
1.5  多平臺的打包機制 13
1.5.1  macOS包機制 13
1.5.2  Ubuntu包機制 16
1.5.3  Windows的包機制 18
1.6  本章小結 20
第2章  構建Markdown編輯器 21
2.1  技術需求 21
2.2  配置新的項目 22
2.3  適配屏幕尺寸 26
2.4  集成應用程序菜單 28
2.4.1  創建一個自定義菜單項 29
2.4.2  定義菜單項角色 32
2.4.3  菜單分隔符 33
2.4.4  鍵盤加速鍵 35
2.4.5  特定平臺的菜單 36
2.4.6  配置菜單中的應用程序名稱 38
2.4.7  隱藏菜單項 39
2.4.8  進程間的消息發送 41
2.4.9  將文件保存至本地繫統 46
2.4.10  從本地繫統中加載文件 53
2.4.11  創建一個文件菜單 57
2.5  添加拖曳功能 59
2.6  支持自動更新功能 62
2.7  修改應用程序的標題 71
2.8  本章小結 72
第3章  與Angular、React和Vue集成 73
3.1  技術需求 73
3.2  利用Angular構建Electron應用程序 73
3.2.1  生成Angular項目 74
3.2.2  將Angular項目與Electron集成 76
3.2.3  配置實時重載 81
3.2.4  設置生產版本 83
3.2.5  設置條件加載 85
3.2.6  使用Angular Material組件 87
3.2.7  Anguar路由機制 91
3.3  利用React構建Electron應用程序 98
3.3.1  創建React項目 98
3.3.2  實時重載 102
3.3.3  設置產品發布版本 105
3.3.4  設置條件加載 107
3.3.5  使用Blueprint UI工具箱 108
3.4  利用Vue.js構建Electron應用程序 113
3.4.1  創建一個Vue配置文件 117
3.4.2  實時重載 119
3.4.3  產品發布版本 121
3.4.4  設置條件加載 122
3.4.5  添加路由機制 123
3.4.6  配置Vue Material 125
3.5  本章小結 129
第4章  構建屏幕截圖剪裁工具 131
4.1  技術需求 131
4.2  準備項目 132
4.3  配置無框窗口 133
4.3.1  macOS的附加選項 135
4.3.2  使用隱藏的titleBarStyle 135
4.3.3  titleBarStyle屬性的hiddenInset值 136
4.3.4  titleBarStyle的customButtonsOnHover值 137
4.4  透明窗口 138
4.5  可拖曳的應用程序窗口 141
4.6  添加截圖工具欄按鈕 142
4.7  使用desktopCapturer API 144
4.8  計算主顯示尺寸 145
4.9  生成並保存縮略圖 146
4.10  重置圖像尺寸並剪裁圖像 148
4.11  測試應用程序的行為 151
4.12  集成繫統托盤 152
4.13  啟動時隱藏主應用程序菜單 154
4.14  注冊全局鍵盤快捷方式 155
4.15  本章小結 157
第5章  制作2D遊戲 159
5.1  技術需求 159
5.2  配置遊戲項目 160
5.3  運行Hello World示例 163
5.4  渲染背景圖像 166
5.5  禁止窗口尺寸變化 168
5.6  渲染精靈對像 168
5.7  縮放精靈對像 169
5.8  處理鍵盤輸入 171
5.9  根據方向翻轉飛船對像 173
5.10  控制精靈對像的坐標 174
5.11  控制精靈對像的速度 177
5.12  本章小結 179
第6章  構建音樂播放器 181
6.1  技術需求 181
6.2  創建項目 182
6.3  音樂播放器組件 184
6.3.1  下載音樂文件 185
6.3.2  基本的播放器設置 188
6.3.3  樣式按鈕 192
6.4  播放控制按鈕 195
6.4.1  Stop按鈕 195
6.4.2  靜音和非靜音按鈕 197
6.4.3  音量按鈕 199
6.5  實現歌曲的進度欄 202
6.6  顯數據 203
6.7  改進用戶界面 208
6.8  終的結構 210
6.9  本章小結 213
第7章  分析、Bug跟蹤和許可機制 215
7.1  技術需求 215
7.2  連接分析和跟蹤機制 216
7.3  構建自身方案或使用已有服務 216
7.3.1  創建自己的分析服務 217
7.3.2  使用第三方分析服務 217
7.4  針對Electron應用程序使用Nucleus 218
7.5  創建一個新的Nucleus賬戶 219
7.6  創建基於跟蹤支持的新項目 222
7.7  安裝Nucleus Electron庫 224
7.8  查看實時分析數據 226
7.9  禁用每個用戶請求的跟蹤機制 230
7.10  驗證實時用戶統計結果 231
7.11  支持離線模式 232
7.12  處理應用程序更新 232
7.13  加載全局服務器設置 235
7.14  許可檢查機制和政策 237
7.14.1  創建新策略和許可 237
7.14.2  檢查應用程序中的證書 240
7.15  本章小結 241
第8章  利用Firebase構建群聊應用程序 243
8.1  技術需求 243
8.2  創建一個Angular項目 245
8.3  創建新的Firebase賬戶 248
8.4  創建一個Firebase應用程序 252
8.5  配置Angular Material組件 254
8.5.1  添加Browser Animations模塊 255
8.5.2  配置默認的主題 255
8.5.3  添加Material Icons庫 255
8.5.4  添加導航欄 256
8.5.5  利用材質工具欄測試應用程序 257
8.6  構建登錄對話框 258
8.6.1  實現Material界面 259
8.6.2  錯誤處理機制 261
8.6.3  準備聊天組件占位符 262
8.7  將登錄對話框連接至Firebase Authentication 263
8.7.1  啟用注冊供應商 264
8.7.2  創建示例賬戶 266
8.7.3  集成Login對話框和Firebase 268
8.8  配置實時數據庫 271
8.9  渲染聊天群列表 275
8.10  實現群消息頁面 279
8.11  顯示群消息 281
8.12  發送群消息 285
8.12.1  更新消息列表界面 288
8.12.2  進一步改進 288
8.13  驗證Electron Shell 289
8.14  本章小結 290
第9章  構建eBook編輯器和生成器 291
9.1  技術需求 291
9.2  創建項目結構 292
9.2.1  生成新的React應用程序 292
9.2.2  安裝編輯器組件 293
9.2.3  測試Web應用程序 298
9.2.4  與Electron Shell集成 300
9.3  升級代碼並使用React Hooks 301
9.4  控制鍵盤快捷方式 302
9.4.1  加載文件 303
9.4.2  保存文件 306
9.5  集成應用程序菜單 308
9.6  設置電子書生成器 311
9.6.1  安裝Docker 312
9.6.2  運行Pandoc容器 315
9.6.3  將文檔發送至主進程（Node.js） 317
9.7  從Electron中調用Docker命令 320
9.7.1  將標記文本發送至Node.js進程 320
9.7.2  將標記文本保存至本地磁盤 320
9.8  生成PDF電子書 323
9.9  生成ePub電子書 325
9.10  本章小結 328
第10章  構建桌面數字錢包 329
10.1  技術需求 329
10.2  利用React生成項目 330
10.3  集成Ant Design庫 332
10.4  設置個人以太坊區塊鏈 334
10.5  配置Ethereum JavaScript API 338
10.6  顯示以太坊節點信息 340
10.6.1  獲取節點信息 340
10.6.2  在Header中渲染節點信息 341
10.7  集成應用程序菜單 342
10.8  渲染賬戶列表 344
10.9  顯示賬戶餘額 347
10.10  將以太轉至另一個賬戶中 350
10.11  打包應用程序並發布 355
10.12  本章小結 358

前    言
本書將引領讀者設置、配置、構建和發布Electron應用程序，並提供進一步的實戰經驗。其間，我們將構建多個項目、處理各種挑戰和問題，並將JavaScript框架與底層工具鏈集成。
適用讀者
本書面向初學者或有經驗的Web開發人員。讀者應具備HTML、CSS和JavaScript方面的基礎知識，並熟悉React、Angular或Vue.js框架之一。
另外，本書不要求桌面開發方面的前期知識。
本書內容
第1章準備開發環境並開始Electron開發。
第2章引領讀者熟悉典型Electron應用程序的主要構造模塊。
第3章介紹前端JavaScript框架，如Angular、React.js和Vue.js，以及如何將其集成至Electron應用程序中，以構建跨平臺的桌面應用程序，進而通過站點共享代碼庫。
第4章考查如何與Electron中的本地圖像捕捉API協調工作、繫統托盤集成和鍵盤處理機制。
第 5 章討論一個有趣的JavaScript遊戲引擎，並處理遊戲循環、加載外資源，以及處理Main和Renderer進程間的通信。
第6章將構建一個包含播放列表和定制專輯封面的桌面音樂播放器。
第7章針對在生產中監控Electron應用程序、跟蹤錯誤和崩潰、分析實時用戶群提供了必要的信息。
第 8 章創建一個具有群聊功能的Electron應用程序，針對移動應用程序集成Google Firebase服務、配置Google Authentication，並在雲中存儲應用程序數據。
第9章將創建一個簡單的跨平臺圖書編輯器，並利用Docker生成PDF和ePub圖書，隨後在獨立的Electron窗口中預覽PDF文件。
第 10 章將開發一個簡單的數字錢包應用程序（與外部服務集成），並連接至運行於本地的服務器。
發布周期
從2019年5月13日開始，Electron項目的發布周期改為12周。讀者可訪問官方文檔查看詳細內容，對應網址為https://electronjs.org/blog/12-week-cadence。
縮短發布周期意味著我們可更快地獲取新特性、修復Bug和安全問題。當然，這也意味著，本書出版後很可能會發布新的Electron版本。
好消息是，Electron團隊支持近的3個主要版本。對此，讀者可訪問https://electronjs. org/docs/tutorial/support#supported-versions查看時間表和更多細節內容。另外，通過輸入下列命令，我們還可以方便地將應用程序項目更新至Electron的版本：

npm install electron@latest

關於每個版本的詳細信息，這裡建議關注Electron團隊的博客，對應網址為https:// www.electronjs.org/blog。
背景知識
讀者應了解Node.js（https://nodejs.org/en/）及其基本命令，如npm install。
偏好Angular的讀者需要了解與Angular CLI相關的細節信息（https://cli.angular.io/）及其命令。
針對React開發，讀者應了解Create React App（https://github.com/facebook/create-react- app）工具。
對於Electron開發，當使用Vue.js框架時，Vue CLI（https://cli.vuejs.org/）應用程序文檔包含了豐富的細節信息和示例。
 
下載示例代碼文件
讀者可訪問www.packt.com並通過個人賬戶下載本書的示例代碼文件。無論讀者在何處購買了本書，均可訪問www.packt.com/support，經注冊後我們會直接將相關文件通過電子郵件的方式發送給您。
下載代碼文件的具體操作步驟如下。
（1）訪問www.packt.com並注冊。
（2）選擇Support選項卡。
（3）單擊Code Downloads。
（4）在Search搜索框中輸入書名。
當文件下載完畢後，可利用下列軟件的版本解壓或析取文件夾中的內容。
? WinRAR/7-Zip（Windows環境）。
? Zipeg/iZip/UnRarX（Mac環境）。
? 7-Zip/PeaZip（Linux環境）。
另外，本書的代碼包也托管於GitHub上，對應網址為https://github.com/PacktPublishing/ Electron-Projects。若代碼被更新，現有的GitHub庫也會保持同步更新。
讀者還可訪問https://github.com/PacktPublishing/並從對應分類中查看其他代碼包和視頻內容。
 圖標表示警告或重要的注意事項。
 圖標表示提示信息和操作技巧。
讀者反饋和客戶支持
歡迎讀者對本書提出建議或意見。
對此，讀者可向customercare@packtpub.com發送郵件，並以書名作為郵件標題。
勘誤表
盡管我們希望做到盡善盡美，但不足依然在所難免。如果讀者發現謬誤之處，無論是文字錯誤抑或代碼錯誤，還望不吝賜教。對此，讀者可訪問http://www.packtpub.com/submit- errata，選取對應書籍，輸入並提交相關問題的詳細內容。
版權須知
一直以來，互聯網上的版權問題從未間斷，Packt出版社對此類問題異常重視。若讀者在互聯網上發現本書任意形式的副本，請告知我們網絡地址或網站名稱，我們將對此予以處理。關於盜版問題，讀者可發送郵件至copyright@packtpub.com。
若讀者針對某項技術具有專家級的見解，抑或計劃撰寫書籍或完善某部著作的出版工作，可訪問authors.packtpub.com。
問題解答
若讀者對本書有任何疑問，均可發送郵件至questions@packtpub.com，我們將竭誠為您服務。