Electron安装到打包

一、初始化项目

  新建目录(ElectronApp)并初始化

npm init -y

  新建index.js

const { app, BrowserWindow } = require('electron')
app.whenReady().then(() => {
    const win = new BrowserWindow({
       width: 1920,
       height: 1080,
       resizable:false, // 窗口大小是否可调整。 默认值为 true。
       frame:false,  //设置为 false 时可以创建一个无边框窗口 默认值为 true
       alwaysOnTop:true, //窗口是否永远在别的窗口的上面。 默认值为 false.
       fullscreen:true, // 窗口是否全屏. 默认值为 false
       movable:false, //窗口是否可移动。 默认值为 true。
	   icon: '/app.ico', //这个是引入的icon
    });
	//启动本地页面
    win.loadFile('index.html');
	//引用Url地址
	//mainWindow.loadURL(`http://www.baidu.com`);
	// 打开开发者工具
	//win.webContents.openDevTools()
	// 当 window 被关闭，这个事件会被触发。
	win.on('closed', () => {
	     //与此同时，你应该删除相应的元素。
	     win = null
	})
})

// 当全部窗口关闭时退出。
app.on('window-all-closed', () => {
    // 在 macOS 上，除非用户用 Cmd + Q 确定地退出，
    // 否则绝大部分应用及其菜单栏会保持激活。
    if (process.platform !== 'darwin') {
        app.quit()
    }
})
 
app.on('activate', () => {
    // 在macOS上，当单击dock图标并且没有其他窗口打开时，
    // 通常在应用程序中重新创建一个窗口。
    if (mainWindow === null) {
        createWindow()
    }
})

二、安装环境

npm install electron@8.5.5 --registry=https://registry.npmmirror.com

配置启动命令

"scripts": {
    "start": "electron .",
}

   用淘宝镜像源其他太慢了。我用的8.5.5，最新版本打出的包太大了。你也可以选其他。

#你也可以设置全局的镜像源。就不用加--registry=https://registry.npmmirror.com 
#默认镜像源设置
npm config set registry https://registry.npmmirror.com

  如果总是卡在reify:lodash: timing reifyNode:node_modules/@xxx Completed in 8ms

#先安装cnpm
npm install -g cnpm --registry=https://registry.npmmirror.com

#再进行安装
cnpm install --save-dev electron

三、安装electron-packager打包

npm install -g electron-packager --registry=https://registry.npmmirror.com

四、打包

#解决打包慢
npm config set electron_mirror https://registry.npmmirror.com/electron/
或npm config set electron_mirror=https://registry.npmmirror.com/

#直接打包
electron-packager . MyApp --win32 --arch=x64 --overwrite --ignore=node_module

#配置命令
"scripts": {
    "start": "electron .",
    "pack64": "electron-packager . MyApp --win32 --arch=x64 --overwrite --ignore=node_module",
    "pack32": "electron-packager . MyApp --win32 --arch=ia32 --overwrite --ignore=node_module"
  },