Electron应用程序打包（Windows环境下）

Electron 官网地址：https://electronjs.org/

一、搭建环境

如果你可以建一个网站，你就可以建一个桌面应用程序。 Electron 是一个使用 JavaScript, HTML 和 CSS 等 Web
技术创建原生程序的框架，它负责比较难搞的部分，你只需把精力放在你的应用的核心上即可。

刚开始学习，我们先clone了一个starter来快速学习一下，熟悉之后再来把我们自己的项目生成桌面程序。

首先，安装nodejs、cnpm，在安装nodejs是会附带安装npm。

nodejs、cnpm的安装参考我这篇文章 ，地址 https://blog.csdn.net/u012577474/article/details/92849764
*Electron的安装
#采用npm的方法安装Electron

cnpm install -g electron

查看electron是否安装成功可通过命令 electron -v 查看。
安装electron-packager打包工具

cnpm install -g electron-packager

二、学习Electron 的Hello world 程序

git clone https://github.com/electron/electron-quick-start		#下载hello world程序
cd electron-quick-start
cnpm install //这里我用的是cnpm,npm太慢了 
npm start

npm start 之后就会出现electron的桌面端页面了。

electron-quick-start目录结构

main.js 是应用程序入口文件
index.html 是目标web

三、把Hello world 网页程序打包成exe可执行桌面程序（打包）

在electron-quick-start目录下准备应用程序的图标 icon.ico（作为生成的exe程序图标），

1、使用命令打包方法：

electron-packager . 'HelloWorld' --platform=win32 --arch=x64 --icon=icon.ico --out=./out --asar --app-version=0.0.1

打包完成后，目录下会多出out文件夹，exe程序就在out’HelloWorld’-win32-x64文件夹下。



点击’HelloWorld’.exe运行exe桌面程序如下：

2、使用package.json打包方法：
首先编辑package.json，增加一行

"package":"electron-packager ./app 'HelloWorld' --platform=win32 --arch=x64 --icon=icon.ico --out=./out --asar --app-version=0.0.1"

别忘了前面补逗号。

在app(electron-quick-start)根目录创建app文件夹，并把main.js， index.html 和 package.json拷贝进去（拷贝并非剪切），然后在electron-quick-start根目录执行命令：

npm run-script package

打包完成。