共计 1418 个字符，预计需要花费 4 分钟才能阅读完成。
每次文章都从 0 开始从搭建开始 使用的是 electron-vue 毕竟方便一点 如果只想安装 electron 请参见我的另一个文章 https://segmentfault.com/a/11…
开发目录: F:lee` 开发环境: windows10IDE: phpstorm
安装 electron
vue init simulatedgreg/electron-vue project3
cd project1
npm install // 第一次安装的伙伴需要翻墙 如何翻墙请参加另一个文章 (好像被和谐了 那就 + 我们的交流群 814270669 吧!)
编写一个页面
使用 IDE 打开随便编写一个页面
使用 npm 构建安装包
npm run build
安装程序制作
下载 NSIS 软件，安装
下载地址:https://pan.baidu.com/s/1HrZz…
下载完毕打开 下一步 下一步 就行了 傻瓜式安装
NSIS 新建脚本
点击软件左上角文件 -> 选择新建脚本 (向导)
到应用程序信息这里 填写的应用程序名称必须和你 package.json 里面配置的一样 否则你有自动更新的时候会安装一个另一个程序! 这里选择图标就行了
这里暂时默认就行了 后面出一个文章详细介绍这里
F:\lee\project3\build\win-unpacked\project3.exe 主程序就是 buildwin-unpacked 的 exe 文件
选择 F:\lee\project3\build\win-unpacked
编译脚本
终于到了编译脚本了 如果按照上面的步骤执行 到这步会自动编译并且运行 如果没有自动编译点击顶部菜单栏的编译按钮
编译过程可能稍微有点长 1 - 3 分钟吧 编译完成之后会自动运行安装程序
友情提示
杀软报毒
electron 做的软件会被某流氓杀软报毒 没办法解决 在这里给出一个解决办法安装程序检测 360 是否运行 如果在运行就禁止安装其中使用到一个 dll 插件 (FindProcDLL.dll) 官方下载地址:http://nsis.sourceforge.net/F… 作者提供的下载地址:https://pan.baidu.com/s/1EpJa…
下载完毕之后 放到 NSIS 目录下的 VNISEdit\Plugins 目录中如果不知道目录 那就在桌面 右击 VNISEdit 编译环境 选择打开所在目录 就可以看到了
在脚本最后加一句编译完成后会后些方法: 一个是 un.onInit -> 卸载程序一个是 un.onUninstSuccess -> 卸载成功提示.onInit 安装程序初始化
# 检测 360 杀毒软件是否在运行
Function .onInit
FindProcDLL::FindProc “360tray.exe”
Pop $R0
IntCmp $R0 1 0 no_run
MessageBox MB_ICONSTOP “ 安装程序检测到 360 流氓软件正在运行，请退出程序后重试!”
Quit
no_run:
FunctionEnd
由于我电脑没有装 360 所以我使用 qq 来做演示
# 检测电脑管家是否在运行
Function .onInit
FindProcDLL::FindProc “QQ.exe”
Pop $R0
IntCmp $R0 1 0 no_run
MessageBox MB_ICONSTOP “ 安装程序检测到 qq 流氓软件正在运行，请退出程序后重试!”
Quit
no_run:
FunctionEnd
NSIS 运行必须为管理员
请以管理员身份运行 VNISEdit 编译环境 不然会终止编译并且有一个警告 好像是需要提级 什么什么的!