vue+electron 打包桌面应用exe

说明：

      将vue打包好的文件置于单独的目录下(这里配置的是发版后的线上地址)，新建main.js、package.json 文件。

1，初始化文件夹，安装打包相关的依赖：

{
  "name": "ichat",
  "version": "1.0.1",
  "description": "",
  "main": "./main.js",
  "build": {
    "appId": "com.leon.ichat",
    "productName": "iChat",
    "dmg": {
      "background": "res/background.png",
      "window": {
        "x": 100,
        "y": 100,
        "width": 1085,
        "height": 670
      }
    },
    "win": {
      "icon": "res/icon.ico",
      "target": "nsis"
    }
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron .",
    "pack": "electron-builder --dir",
    "dist": "electron-builder",
    "fix": "electron-fix start"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {},
  "devDependencies": {
    "electron": "^7.3.3",
    "electron-builder": "^22.10.5",
    "electron-package": "^0.1.0"
  }
}

2，main.js 配置exe访问的页面设置，高度，宽度、地址等：

const {app, BrowserWindow} =require('electron');//引入electron
let win;
let mainWindow;
let windowConfig = {
    width: 1085,//创建窗口的宽度
    height: 670,//窗口高度
    webPreferences: {//解决跨域问题
        webSecurity: false
    }
};//窗口配置程序运行窗口的大小
function createWindow(){
    win = new BrowserWindow(windowConfig);//创建一个窗口
    // win.loadURL(`file://${__dirname}/dist/index.html`);//在窗口内要展示的内容index.html 就是打包生成的index.html
    win.loadURL('http://www.baidu.com');//在窗口内要展示的内容index.html 就是打包生成的index.html
    // win.webContents.openDevTools();  //开启调试工具
    win.on('close',() => {
        //回收BrowserWindow对象
        win = null;
    });
    win.on('resize',() => {
        win.reload();
    })
}
app.on('ready',createWindow);
app.on('window-all-closed',() => {
    app.quit();
});
app.on('activate',() => {
    if(win == null){
        createWindow();
    }
});