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应用(打包填坑)的更多相关文章

  1. Android—基于微信开放平台v3SDK,开发微信支付填坑。

    接触微信支付之前听说过这是一个坑,,,心里已经有了准备...我以为我没准跳坑出不来了,没有想到我填上了,调用成功之后我感觉公司所有的同事都是漂亮的,隔着北京的大雾霾我仿佛看见了太阳~~~好了,装逼结束 ...

  2. WebApi传参总动员(填坑)

    本以为系列文章已经Over,突然记起来前面留了个大坑还没填,真是自己给自己挖坑. 这个坑就是: (body 只能被读取一次)Only one thing can read the body MVC和W ...

  3. UiAutomator2.0升级填坑记

    UiAutomator2.0升级填坑记 SkySeraph May. 28th 2017 Email:skyseraph00@163.com 更多精彩请直接访问SkySeraph个人站点:www.sk ...

  4. Android项目开发填坑记-so文件引发的攻坚战

    故事的最初 我负责的项目A要求有播放在线视频的功能,当时从别人的聊天记录的一瞥中发现百度有相关的SDK,当时找到的是Baidu-T5Player-SDK-Android-1.4s,项目中Demo的so ...

  5. wap2app(十)--wap2app 添加原生底部导航,添加原生标题栏,填坑

    一.添加原生标题栏 添加原生标题栏可以参照 <wap2app(六)-- wap2app的原生标题头无法隐藏>,具体如下: 1.打开 sitemap.json文件 --> page配置 ...

  6. electron安装+运行+打包成桌面应用+打包成安装文件+开机自启动

    1.初始化node项目,生成package.json文件 npm init 2.安装electron,并保存为开发依赖项 npm install electron -D 3.根目录下新建index.j ...

  7. 使用vue开发微信公众号下SPA站点的填坑之旅

    原文发表于本人博客,点击进入使用vue开发微信公众号下SPA站点的填坑之旅 本文为我创业过程中,开发项目的填坑之旅.作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱^ ...

  8. Android Studio 3.0正式版填坑之路

    原文:https://www.jianshu.com/p/9b25087a5d7d   Android Studio 3.0启动图 序言 总看别人的文章,今天尝试着自己来写一篇.在逛论坛时候,无意间发 ...

  9. Vue2.0 新手完全填坑攻略——从环境搭建到发布

    Jinkey原创感谢 showonne.yubang 技术指导Demo 地址:http://demo.jinkey.io/vue2源码:https://github.com/Jinkeycode/vu ...

随机推荐

  1. Jmeter正则表达式提取多个值示例

    首先了解一下常用正则表达式的语法 \d           数字 \w          数字或者字母 .             可以匹配任意字符 星号*     表示任意个字符  +       ...

  2. iptables 规则(Rules)

    iptables的每一条规则(rule),都是由两部分组成的,第一部分包含一或多个「过滤条件」其作用是检查包是否符合处理条件(所有条件都必须成立才算数) :第而部分称为「目标」,用於決定如何处置符合条 ...

  3. H3C 命令行编辑功能

  4. H3C 网络号和主机号

  5. HTML静态网页--JavaScript-简介

    JavaScript简介 1.JavaScript是个什么东西? 它是个脚本语言,需要有宿主文件,它的宿主文件是HTML文件. 2.它与Java什么关系? 没有什么直接的联系,Java是Sun公司(已 ...

  6. 【原生JS】写最简单的图片轮播

    非常简单的一个大图轮播,通过将控制显示位置来进行轮播效果,写来给正在学习的新手朋友们参考交流. 先看效果:(实际效果没有这么快) 先看布局: <div id="display" ...

  7. 简单的Spring Batch示例

    使用Spring Batch做为批处理框架,可以完成常规的数据量不是特别大的离线计算. 现在写一个简单的入门版示例. 这里默认大家已经掌握了Spring Batch的基本知识,示例只是为了快速上手实践 ...

  8. H3C Basic NAT配置示例

  9. [转]ECMAScript 2016,2017 和 2018 中所有新功能的示例

    很难追踪 JavaScript(ECMAScript)中的新功能. 想找到有用的代码示例更加困难. 因此,在本文中,我将介绍 TC39 已完成 ES2016,ES2017 和 ES2018(最终草案) ...

  10. 2019-4-12-WPF-绑定的默认模式

    title author date CreateTime categories WPF 绑定的默认模式 lindexi 2019-04-12 09:38:58 +0800 2019-04-12 09: ...