如何利用electron-nativefier将WordPress网站打包成电脑exe应用软件，可安装，详细小白图文教程

上一次给大家分享了如何利用HBuliderX将WordPress网站打包为手机APP，超详细图文教程。这次继续分析如何使用electron将WordPress网站打包成电脑exe应用软件，详细图文教程。

教程十分简单，按照步骤操作即可

1 前置条件

1.1 环境准备

打包需要node.js、electron、electron-packager、NET 4.5以上环境，下面请参考教程操作

1.1.1 node.js

前往 https://nodejs.org/en/ 进行下载并安装，选择LTS 稳定版本，安装直接下一步即可，过程略过

安装完成之后打开cmd控制台（快捷键：win+R，输入框输入CMD）

接着输入 node -v检查是否有版本输出，参考：

1.1.2 nativefier环境

上一步安装完成后，继续在CMD控制台输入：npm install nativefier -g

2 详细教程

2.1 创建目录和图标

在电脑任意位置新建一个文件夹，命名为winApp

2.2 创建exe

通过CMD进入刚才创建的目录：cd G:\app\winApp

然后执行：

nativefier --name  北忘山  https://beiwangshan.com 
​
​
nativefier --name 北忘山 --icon ./logo.png https://beiwangshan.com 

参数说明

bwsblog：应用名称

https://beiwangshan.com：需要生成网页的链接地址

2.3 运行程序

这时候在目录下面可以看到生成完成的app

点击exe文件即可运行，但是这种应用包的形式还不是最后的效果，我们需要一个可以安装的exe文件，这就需要进行安装程序打包，具体可以参考下面的教程

3 打包可安装程序

首先需要下载Inno Setup Compiler，这个可以在北忘山提供的加速下载链接进行下载

推荐下载地址1：https://url62.ctfile.com/f/26340362-598949280-8d93c3?p=5817 (访问密码: 5817)

推荐下载地址2：https://pan.quark.cn/s/70ebba671b29

推荐下载地址3：https://www.123pan.com/s/RrnRVv-2Dsxd

推荐下载地址4：https://beiwangshan.lanzoum.com/ipMU206m5v7c

下载后自行安装

3.1 打包步骤

点击file -> new 新建一个项目

点击next

按照提示依次输入程序名称，版本号，发布者，程序地址，点击Next

输入安装目录名称（这会在安装的时候在安装者电脑新建），点击Next

然后输入exe的目录信息，然后Next

输入程序名称，然后Next

后面一直点击next，如果要修改图标可以在如下这个界面修改

继续Next，直到显示finish，然后点击finish

显示是否编译程序，点击是

然后开启编译

打开文件生成路径，就可以看到生成的APP了

4 北忘山博客exe Windows版本下载

程序已经给各位打包好了，欢迎下载体验尝鲜！

下载地址：https://url62.ctfile.com/f/26340362-598957507-ce7941?p=5817 (访问密码: 5817)

下载链接：https://pan.quark.cn/s/28aa8404966e

下载地址：https://beiwangshan.lanzoum.com/ise4o06m7ouf

下载地址：https://www.123pan.com/s/RrnRVv-sDsxd