每次文章都从0开始 从搭建开始 使用的是electron-vue 毕竟方便一点 如果只想安装electron 请参见我的另一个文章https://segmentfault.com/a/11...
开发目录: F:lee` 开发环境: windows10
IDE: phpstorm
安装electron
代码语言:javascript复制
vue init simulatedgreg/electron-vue project3
cd project1
npm install //第一次安装的伙伴需要访问外国网站 如何访问外国网站请参加另一个文章(好像被和谐了 那就 我们的交流群 814270669 吧!)
编写一个页面
使用IDE打开随便编写一个页面
使用npm 构建安装包
代码语言:javascript复制
npm run build
安装程序制作
下载NSIS软件,安装
下载地址:https://pan.baidu.com/s/1HrZz...
下载完毕打开 下一步 下一步 就行了 傻瓜式安装
NSIS新建脚本
点击软件左上角文件->选择新建脚本(向导)
到应用程序信息这里 填写的应用程序名称必须和你package.json里面配置的一样 否则你有自动更新的时候会安装一个另一个程序!
这里选择图标就行了
这里暂时默认就行了 后面出一个文章详细介绍这里
F:leeproject3buildwin-unpackedproject3.exe
主程序就是 buildwin-unpacked的exe文件
选择 F:leeproject3buildwin-unpacked
编译脚本
终于到了编译脚本了 如果按照上面的步骤执行 到这步会自动编译并且运行 如果没有自动编译点击顶部菜单栏的编译按钮
编译过程可能稍微有点长1-3分钟吧 编译完成之后会自动运行安装程序
友情提示
杀软报毒
electron做的软件会被某流氓杀软报毒 没办法解决 在这里给出一个解决办法 安装程序检测360是否运行 如果在运行就禁止安装 其中使用到一个dll插件 (FindProcDLL.dll) 官方下载地址:http://nsis.sourceforge.net/F... 作者提供的下载地址:https://pan.baidu.com/s/1EpJa...
下载完毕之后 放到NSIS
目录下的 VNISEditPlugins
目录中 如果不知道目录 那就在桌面 右击VNISEdit 编译环境 选择打开所在目录 就可以看到了
在脚本最后加一句 编译完成后会后些方法: 一个是un.onInit
->卸载程序 一个是un.onUninstSuccess
-> 卸载成功提示 .onInit
安装程序初始化
代码语言:javascript复制
# 检测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 来做演示
代码语言:javascript复制
# 检测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 编译环境 不然会终止编译并且有一个警告 好像是需要提级 什么什么的!