electron框架（2.0）案例分析，安全策略，多系统兼容代码，代码解析，热启动

----远程页面案例示例main.js：

const {app, BrowserWindow} = require('electron')

app.on('ready', () => {
    //当app准备好后，执行createWindow创建窗口
    const win = new BrowserWindow({
        width: 800,//窗口宽度
        height: 600,//窗口高度
        autoHideMenuBar: true,//自动隐藏菜单档
        alwaysOnTop: true,//置顶
        x: 0,//窗口位置x坐标
        y: 0//窗口位置y坐标
    })
    //加载一个远程页面
   win.loadURL('https://blog.youkuaiyun.com/qq_33650655/article/details/140353815')
})

----本地页面案例实列main.js：

const {app, BrowserWindow} = require('electron')

app.on('ready', () => {

    //当app准备好后，执行createWindow创建窗口
    const win = new BrowserWindow({
        width: 800,//窗口宽度
        height: 600,//窗口高度
        autoHideMenuBar: true,//自动隐藏菜单档
        alwaysOnTop: true,//置顶
    })
    //引入页面
    win.loadFile('./pages/index/index.html')

})

----取消显示内容安全策略的提示（可查看mdn官网）：

在html页面中添加mete标签：

<meta
  http-equiv="Content-Security-Policy"
  content="default-src 'self'; img-src https://*; child-src 'none';" />

----多系统的兼容代码：

const {app, BrowserWindow} = require('electron')

function createWindow(){
    //当app准备好后，执行createWindow创建窗口
    const win = new BrowserWindow({
        width: 800,//窗口宽度
        height: 600,//窗口高度
        autoHideMenuBar: true,//自动隐藏菜单档
        alwaysOnTop: true,//置顶
    })
    win.loadFile('./pages/index/index.html')
}
app.on('ready', () => {
    createWindow()

    //兼容核心代码 1----windows和lunx
    app.on('activate', () => {
        if (BrowserWindow.getAllWindows().length === 0) createWindow()
    })


})

//兼容核心代码 2----mac
app.on('window-all-closed', () => {
    if (process.platform !== 'darwin') app.quit()
})

----相同的代码解析：

app.on('ready', () => {
   // 写核心代码
})
// 或者
app.whenReady().then(() => {
  //写核心代码
})

----热启动

---配置热启动：

npm i nodemon -D

package.json里重写start：

 "start": "nodemon --exec electron ."

---更新index.html里的代码不能热更新，要加一个nodemon.json，需要手动添加

nodemon.json代码：

{
  "ignore":[
    "node modules",
    "dist"
  ],
  "restartable":"r",
  "watch":["*.*"],
  "ext":"html,js,css"
}