Electron-forge应用(打包填坑)
Electron-forge应用
一、 使用Electron-Forge做应用的缘由
最近遇到一个需求,Web应用登录时要校验用户的登录Mac地址,以确定该用户是在授权过的电脑设备上登录的。没错我傻了,没多想就直接开始做,后面卡到了,这管理端是获取不到的啊,浏览器也限制了获取客户端电脑信息(除了IE)。然后想了很多方法都不行,最后决定做个桌面应用,然后将电脑的信息通过接口给浏览器调用,之后看网上的大佬分析,这款是最适合的,方便快捷,上手快,只要有点前端基础都用得起来,本人是个后端,也用得挺舒服的。
二、 Electron-Forge的应用
1、 使用electron-forge的准备

1) 装vscode,极力推荐vscode,轻量、上手快,vscode的社区氛围也很好,插件多。
2) 装git, electron-forge打包时会检测系统,没有装git是打不了包的
3) 接下来打开vscode,全局装上electron-forge。
网上的文档都有,我就不多说了;
官网:https://www.worldlink.com.cn/osdir/electron-forge.html
2、 起步
npm install -g electron-forge electron-forge init my-new-app cd my-new-app npm start
做完这上面几步,你能看到一个应用的窗体显示在桌面

如果没有跑不起来,请直接打开package.json,复制命令直接运行

有没有一种超级简单的感觉
三、 使用Electron -forge遇到坑
接下来就是本人遇到的坑了:
1、 关于package.json文件的配置electronPackagerConfig,配置icon的时候,不能加后缀,因为electron-forge这个脚手架会帮你自动检测系统,自动帮你加上适合系统的icon

2、 引入的包,开发环境和正式环境都要,不然打包不成功

3、 最坑的来了,就是打包成安装包的时候,项目名称不能是中文,就是运行electron-forge make,成功后安装不了。


四、 一个Demo,已经放上码云了
https://gitee.com/aliyunjie/electron-forge-mac
五、 总结
1、 学习到了点新东西,不过用的还是很不熟悉,花了半天入门,然后后面都是跳坑里浪费时间,感觉网上资料还是有点少,很多东西都得自己去搞清楚。
2、 详细的解释可以看我发在码云上的demo
3、 转发请注明出处,谢谢!
Electron-forge应用(打包填坑)的更多相关文章
- Android—基于微信开放平台v3SDK,开发微信支付填坑。
接触微信支付之前听说过这是一个坑,,,心里已经有了准备...我以为我没准跳坑出不来了,没有想到我填上了,调用成功之后我感觉公司所有的同事都是漂亮的,隔着北京的大雾霾我仿佛看见了太阳~~~好了,装逼结束 ...
- WebApi传参总动员(填坑)
本以为系列文章已经Over,突然记起来前面留了个大坑还没填,真是自己给自己挖坑. 这个坑就是: (body 只能被读取一次)Only one thing can read the body MVC和W ...
- UiAutomator2.0升级填坑记
UiAutomator2.0升级填坑记 SkySeraph May. 28th 2017 Email:skyseraph00@163.com 更多精彩请直接访问SkySeraph个人站点:www.sk ...
- Android项目开发填坑记-so文件引发的攻坚战
故事的最初 我负责的项目A要求有播放在线视频的功能,当时从别人的聊天记录的一瞥中发现百度有相关的SDK,当时找到的是Baidu-T5Player-SDK-Android-1.4s,项目中Demo的so ...
- wap2app(十)--wap2app 添加原生底部导航,添加原生标题栏,填坑
一.添加原生标题栏 添加原生标题栏可以参照 <wap2app(六)-- wap2app的原生标题头无法隐藏>,具体如下: 1.打开 sitemap.json文件 --> page配置 ...
- electron安装+运行+打包成桌面应用+打包成安装文件+开机自启动
1.初始化node项目,生成package.json文件 npm init 2.安装electron,并保存为开发依赖项 npm install electron -D 3.根目录下新建index.j ...
- 使用vue开发微信公众号下SPA站点的填坑之旅
原文发表于本人博客,点击进入使用vue开发微信公众号下SPA站点的填坑之旅 本文为我创业过程中,开发项目的填坑之旅.作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱^ ...
- Android Studio 3.0正式版填坑之路
原文:https://www.jianshu.com/p/9b25087a5d7d Android Studio 3.0启动图 序言 总看别人的文章,今天尝试着自己来写一篇.在逛论坛时候,无意间发 ...
- Vue2.0 新手完全填坑攻略——从环境搭建到发布
Jinkey原创感谢 showonne.yubang 技术指导Demo 地址:http://demo.jinkey.io/vue2源码:https://github.com/Jinkeycode/vu ...
随机推荐
- vue element 给指数的div加loading
const loading = this.$loading({ lock: true, text: 'Loading', spinner: 'el-icon-lo ...
- hdu 4114 Disney's FastPass(最短路+状态压缩)
Disney's FastPass Time Limit: 20000/10000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Othe ...
- RequestMapping中produces属性作用
注解RequestMapping中produces属性可以设置返回数据的类型以及编码,可以是json或者xml: @RequestMapping(value="/xxx",prod ...
- 2018-2-13-win10-uwp-如何让-Page-继承泛型类
title author date CreateTime categories win10 uwp 如何让 Page 继承泛型类 lindexi 2018-2-13 17:23:3 +0800 201 ...
- [学习笔记]整体DP
问题: 有一些问题,通常见于二维的DP,另一维记录当前x的信息,但是这一维过大无法开下,O(nm)也无法通过. 但是如果发现,对于x,在第二维的一些区间内,取值都是相同的,并且这样的区间是有限个,就可 ...
- Java一行代码可声明多个同类变量
Java支持一句语句声明多个同类变量. Example: String a = "Hello", c = "hello"; int x = 5, y = 5;
- 如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法
如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法 用过vue的人估计都用过scoped样式属性,但有时候需要穿透样式,啥办? 很多资料都说用>>> 或 ...
- window 系统下修改`CMD`的编码格式的方法,`CHCP` 的 使用
CHCP的使用 CHCP是一个计算机指令,能够显示或设置活动代码页编号. 一般上是在命令提示框中使用,用来查询和修改命令提示框的编码格式 具体使用方法 查看活动代码页编号 方式1: >>& ...
- UVA 437 "The Tower of Babylon" (DAG上的动态规划)
传送门 题意 有 n 种立方体,每种都有无穷多个. 要求选一些立方体摞成一根尽量高的柱子(在摞的时候可以自行选择哪一条边作为高): 立方体 a 可以放在立方体 b 上方的前提条件是立方体 a 的底面长 ...
- H3C 配置静态及动态域名解析