Electron打包前端代码
本文主要介绍如何利用Electron将前端代码打包成exe文件。
其实如何通过Electron将前端代码打包成exe文件，其入门教程讲的挺详细的，但是浏览一遍下来还是不太清楚到底该怎么操作，这里只是将其细化分解。
首先，我们需要确保我们的电脑上已经配置好了Node.js环境，如果没有的话，请到Node.js下载并安装配置。
其次，我们需要有一个写好的Electron应用，如果你不嫌麻烦的话，可以按照入门教程中的打造你第一个Electron应用一步一步自己手动创建，但是我会从他的GitHub仓库里直接下载示例程序来构建Electron应用，因为示例程序中已经包含了必需的index.html, main.js, package.json。这一点，入门教程中也有提及。
1 # 克隆这仓库 2 $ git clone https://github.com/electron/electron-quick-start 3 # 进入仓库 4 $ cd electron-quick-start 5 # 安装依赖库并运行应用 6 $ npm install && npm start
通过上述命令npm install && npm start，我们即可打开示例Electron应用了。
通过view选项中的Toggle Developer Tools，我们可以打开开发者工具对代码进行调试，这一点和直接使用浏览器进行开发没有什么区别。
接下来，我们只需要将我们写好的代码整合到上述Electron应用中即可了。
当我们需要交付成果物给客户时，我们不可能要求客户配置好Node.js环境，同样不可能让客户通过命令运行我们的应用程序，这个时候我们需要使用Electron部署前端应用程序。这一点，入门教程中也有提及。
然后，我们下载好指定的二进制文件（我下载的是electron-v1.7.0-win32-x64.zip，解压到electron-build中，名称随便定），然后将我们整合之后的Electron应用文件夹重命名为app，放到Electron的资源文件夹下（在macOS中是指Electron.app/Contents/Resources/，在Linux和Windows中是指electron-build/resources/）即可。
接着，运行Electron.app（或者Linux中的electron，Windows中的electron.exe），Electron就可以不依赖Node.js运行我们的应用程序了。
最后，就可以将整个的electron-build交付给客户使用了。
有一点需要注意的是，如果不做任何操作，在Electron中直接使用jQuery会没有效果或直接产生异常，解决方案如下：
将jquery.min.js文件中最前面的
1 ! function(a, b) { 2 "object" == typeof module && "object" == typeof module.exports ? module.exports = a.document ? b(a, !0) : function(a) { 3 if (!a.document) throw new Error("jQuery requires a window with a document"); 4 return b(a) 5 } : b(a) 6 }
替换为
!function(a,b){b(a)}
即可。
如果对于这种形式的成果物（并非一个正在的exe应用程序）还不是很满意的话，可以参考这篇教程中的2. 打包成安装包将electron-build打包成安装包（但是通过测试，并不成功，有兴趣的童鞋可以深入研究一下）。
