将HTML项目打包成exe应用

搭建环境

1、安装Node.js¹；

2、全局安装cnpm²（执行控制台命令：npm install -g cnpm --registry=https://registry.npm.taobao.org）；

3、全局安装electron³（执行控制台命令：cnpm install -g electron）；

4、全局安装打包器（执行控制台命令：cnpm install electron-packager -g）。

创建项目

1、将electron的项目模板克隆到本地（执行git命令：git clone https://github.com/electron/electron-quick-start）；

2、安装依赖（进入项目文件夹，执行控制台命令：cnpm install）；

3、将您的项目文件复制到electron的项目模板文件夹内。在项目目录下有一个main.js文件，可修改createWindow函数自定义我们的应用程序：

function createWindow () {
  // Create the browser window.
  mainWindow = new BrowserWindow({
    fullscreen: true,// 全屏
    // width: 800,
    // height: 600,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  })

  mainWindow.setMenu(null);// 隐藏菜单

  // and load the index.html of the app.
  mainWindow.loadFile('index.html')// 设置主窗口对应的HTML文件

  // Open the DevTools.
  // mainWindow.webContents.openDevTools()

  // Emitted when the window is closed.
  mainWindow.on('closed', function () {
    // Dereference the window object, usually you would store windows
    // in an array if your app supports multi windows, this is the time
    // when you should delete the corresponding element.
    mainWindow = null
  })
}

打包

进入项目文件夹，执行控制台命令：electron-packager . 文件名 --win --out 文件夹名 --arch= ia32/x64/armv7l/arm64/mips64el --version版本号 --overwrite --ignore=node_modules --icon=图标.ico

---

1. https://nodejs.org/en/ ↩︎

2. npm是JavaScript的包管理器，cnpm是npm的淘宝镜像，访问速度快 ↩︎

3. 用HTML、CSS、JavaScript来构建跨平台桌面应用程序的一个开源库 ↩︎