electron分為：主程序與渲染程序。
在一個electron的程式中，一般會存在一個主程序跟若幹個渲染程序。
主程序：
1. 可以使用和系統對接的Electron Api -建立菜單，上傳檔案等。
2. 建立渲染程序- Renderer Process
3. 全面支援node.js
4. 隻有一個，作為整個程式的入口點。
渲染程序：
1. 可以有多個，每個渲染程序對應一個視窗。
2. 每個都是一個單獨的程序。
3. 全面支援node.js 和 Dom Api
4. 可以使用一部分Electron提供的API
如果說我們要在一個electron程式打開後，再同時打開一個渲染程序（也就是同時打開兩個視窗）我們應該怎麼辦呢？
const {app,BrowserWindow} = require('electron')
app = 主程式。
BrowserWindow = 建立并控制浏覽器視窗。
app.on('ready',()=>{
let mainWindow = new BrowserWindow({
width:800,
height:600,
webPreferences:{
nodeIntegration:true // 是否啟用node
}
})
mainWindow.loadFile('index.html')// 主程序加載頁面
// 子視窗
let secondWindow = new BrowserWindow({
width: 400,
height: 300,
webPreferences: {
nodeIntegration: true,
},
parent: mainWindow,
})
secondWindow.loadFile('secodWindow.html')
}) 上述代碼在app監測到ready 之後。首先建立了 mainWindow 也就是主程序。主程序渲染的是index.html 這個頁面。而主程序渲染完後，同時又啟動了一個新的子視窗。secondWindow，在它啟動時候配置它的父視窗為 mainWindow。
這樣在一個electron打開的時候我們就可以同時啟動兩個視窗。mainWindow是secordWindow的父級程序。
項目中，我們經常會碰到這樣一個情況，開發環境中，electron的打開位址一般指向本地的項目開發位址，如：localhost:8080。而線上環境的時候就沒有這個位址，我們如何處理？
其實這類問題的答案很簡單，我們需要判斷環境變量。
electron-is-dev 我們在目前項目中安裝以上插件，用來判斷目前環境是否是 dev （開發）環境。
根據目前環境我們可以配置出，如果是開發環境我們就走 位址，如果不是開發環境，我們則走項目打包之後的位址即可。
隐藏electron的邊框之後，突然發現這個程式無法拖動。這個如何解決呢？
<body style="-webkit-app-region: drag">
</body>
// 整個區域可拖拽 // 注意：
如果想要整個視窗都可進行拖拽，則必須将其中的按鈕标記為不可拖拽，否則使用者将無法點選他們
button{
-webkit-app-region:no-drag;
} 在無邊框視窗中，拖動行為可能與選擇文本沖突，為了防止該操作，需要在可拖拽區域内禁用文本選擇。
.titebar{
-webkit-use-select:none;
-webkit-app-region:drag;
} - 在渲染程序中引入 ipc通信 ipcRenderer
const { ipcRenderer } = require('electron') - 在事件中進行消息發送
ipcRenderer.send("監聽名字","消息值") - 在主程序中進行消息監聽
const { ipcMain } = require('electron')
ipcMain.on('message',(event,tag)=>{
console.log(tag)
// 4. 主程序給渲染程序回饋消息。
event.reply('reply',"給message的渲染程序傳回消息");
}) - 渲染程序接收主程序傳回的消息
ipcRenderer.on('reply',(event,tag)=>{
console.log('渲染程序接收到的主程序消息')
}) ![nodejs微信開發---授權登入+擷取使用者資訊微信網頁授權[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)