一个项目正式交付客户使用了,对于版本的升级和代码更新是个一直困扰的问题,由于之前一直都是内部人员使用,可以让他们每次都下载完整压缩包(压缩后大概 40-50MB),但对于正式的终端用户,这个体验是不可接受。 参考过 Electron 官方文档,里面提及的方案兼容性并不好(Linux 不支持),需要准备的东西不少,而且交互上也不满意;本文介绍方案的细节及中间遇到的一些坑。
大概2016年的时候了解到js可以写桌面应用,当时正在用wpf/winform开发cs应用,近几年vue和react在前端的火热,以及node.js在中间层和后端的大量应用,js正在往多端,多平台方向渗透,这个对前端来说是好的,大前端的影响力越来越大。
Electron现在挺火的,官网的标语是使用 JavaScript,HTML 和 CSS 构建跨平台的桌面应用程序。只是没有具体的使用开发项目,所以只是试试创建一个vue项目和用老项目试试能不能打包出来。
目前Electron在github上面的star量已经快要跟React-native一样多了 这里吐槽下,webpack感觉每周都在偷偷更新,很糟心啊,还有Angular更新到了8,Vue马上又要出正
https://github.com/dmhsq/electron-vue-dmhsq 或者 https://github.com/dmhsq/electron-vue/tree/main/template
在 2021 年 star 排行榜单中,tauri 一年增长了 18k 排名第五,我们就很好奇,Tauri 有什么优势呢?
Atom、Postman、Notion、Vscode等都是用Electron开发的
安装electron依赖经常会不成功 在项目目录下创建.npmrc文件,设置镜像地址 npm config set strict-ssl false
Dioxus 是一个可移植的、高性能的、符合人体工程学的框架,使用 Rust 语言构建跨平台的用户界面。Dioxus 可用于生成 网页前端、桌面应用、静态网站、移动端应用、TUI程序、等多类平台应用。如果你能够熟悉使用 React 框架,那 Dioxus 对你来说将非常简单。
随着公司业务的快速发展,商家客服也纳入了我们的服务范围,商家客服工作台的定位是通过工具和数据服务商家,一站式解决用户购买咨询诉求。通过工具和运营策略协助商家提升服务品质,让品牌商家有动力运营好潜在的客户,从而达到提升用户服务的目标。桌面应用的转化在未来是客服产品的方向。
本文要分享的是得物技术团队基于Electron开发客服IM桌面端的技术实践过程,内容包括桌面技术选型、Electron的基础概念、具体的实施技术方案、遇到的棘手问题等。
目前社区两大Vue+Electron的脚手架:electron-vue和vue-cli-plugin-electron-builder,
在之前,给大家介绍过webcontainer这个技术,就是可以让Node.js运行在浏览器中的技术
社交魔方平台是京东的 SNS 活动搭建平台,其内置了很多模板,每一个模板都有一个模板 JSON 用于生成表单,运营同学、商家配置了这个表单后就可以生成活动页面了。模板 JSON 是标准的结构化数据,包含名称、类型、控件类型、校验器、默认值等等字段。以往都是采用手写 JSON 的方式,这是非常低效的,而且容易出错。针对其结构化数据的特点可以用 GUI 的方式去编辑,我们基于 Electron[1] 参考 Github Desktop 客户端[2] 的架构编写了一个 JSON 编辑器(参见下图),通过填写表单的方式生成 JSON。所以在这里记录下这个 Electron 编辑器开发过程中可以记录的点和从 Github Desktop 客户端代码中值得学习的点。
欢迎大家来到今天的早早聊跨端跨栈专场,今天我分享的主题是《如何基于 Electron 开发跨终端的应用》。先做一下自我介绍,我叫逯子洋,17 年加入政采云,目前主要负责政采云前端工程化平台敦煌以及政采云电子招投标客户端的建设。这边是我们团队的微信公众号,大家如果想对我们团队有更多的了解,可以关注一下我们的公众号。
开发新版本 Vue 项目推荐你使用 Vite 脚手架构建开发环境,然而 Vite 脚手架更倾向于构建纯 Web 页面,而不是桌面应用,因此开发者要做很多额外的配置和开发工作才能把 Electron 引入到 Vue 项目中,这也是很多开发者都基于开源工具来构建 Electron+Vue 的开发环境的原因。
概述:本文探讨 Wails 框架的使用,从搭建环境到开发,再到最终的构建打包,本项目源码 GitHub 地址:https://github.com/mazeyqian/go-run-wechat-demo
前端领域快速发展出现了一个有意思的现象:一个开源库壮大后,就会有很多跟随者。这些跟随者会各自开辟细分领域,蚕食先驱的市场。 如果先驱不够强的话,就会慢慢没落(比如 grunt 之于 gulp,gulp 之于 webpack,angular 之于 Vue)。 当然,也有足够厉害的先驱,凭一己之力抗衡所有细分领域的竞争对手,这就是 webpack。 人称「打包工具领域的六边形战士」。 最近这几年,在前端代码打包器领域内,webpack 算得上是时下最流行的前端打包工具。 它可以分析各个模块的依赖关系,最终打包成
自Vue.js 3.0爆出,三大主流框架,写法也是越来越相似,越来越贴近 WebComponents 标准,而周边应用层面的封装已经开始指数级增长。小程序是今年最火的技术,接连出现,快应用也想分一杯羹。PWA(Progressive Web App)进入稳定期,尤其是 PWA桌面版,可以让我们更好的看清楚 PC 桌面版开发的全貌。移动端还是以强运营为主,各大公司都开始不再 全力推动 移动端了,开始重视多端并进,到了开始拼细节的阶段了。TypeScript 全面开花,GraphQL 蠢蠢欲动,WebAssembly 更是打开了浏览器上多语言的大门。所有的这一切都在暗示,浏览器即操作系统,你能想象到未来前端的样子么?
开发者往往通过npm install(或 yarn add)指令完成为Node.js工程安装依赖包的工作,
Electron代码编写之后便是打包, 官网 介绍了几种方法,用了 electron-packager
本篇文章会正式使用xLua完成一个简单的热更新实战案例,关于xLua的基本配置及导入的详细信息可以参考下面这篇文章: Unity 热更新技术 |(六)xLua框架学习最新系列完整教程
热更新的英文全称为Hot Module Replacement,简写为 HMR。当修改代码时,HMR 能够在不刷新页面的情况下,把页面中发生变化的模块,替换成新的模块,同时不影响其他模块的正常运作。
本文由vivo技术团队Yang Kun分享,原题“electron 应用开发优秀实践”,本文有修订。
Electron 团队宣布 Electron 9.0.0 正式发布。新版包括了 Chromium 83、V8 8.3 和 Node.js 12.14 几个组件的升级。此次更新为拼写检查器功能添加了几个新的 API 集成,并新增了 PDF 查看器,还有很多其他的更新。
官方文档:https://cloud.tencent.com/document/product/647/38549 官方demo:https://github.com/LiteAVSDK/TRTC_Electron/tree/main/TRTCSimpleDemo 在官方demo基础上添加“electron-updater” 组件(我们使用这个electron官方组件进行客户端的更新), 在入口文件中main.electron.js 添加引用组件: const { autoUpdater } = require('electron-updater'); 打包出来的程序报错找不到electron-updater包,请问怎样解决,或者怎样实现更新功能
Electron 是一个使用 JavaScript、HTML 和 CSS 等 Web 技术创建原生应用程序的框架。它负责处理困难的部分,因此您可以专注于应用程序的核心。如果您可以构建网站,则可以构建桌面应用程序。
最近一直在使用electron开发桌面应用,对于一个web开发者来说,html+javascript+css的开发体验让我非常舒服。之前我一直简单的以为electron只是张网页加个壳,和那些号称跨平台的运行在手机上的webapp是一个套路。直到我真的需要开发一个跨平台桌面应用的时候,我又认真的尝试了一下electron,我开始意识到:这才是我理想中的跨平台桌面应用开发的最终形态,它简直太优秀了。
微软近期宣布,旗下 Teams 应用活跃用户已经达到惊人的 2.5 亿。这让 Teams 成了继 Word 和 Excel 之后,微软 Office 生产力套件中的又一位当红明星。然而,Teams 一直受到性能问题的困扰,用户们对此吐槽不断。
Electron是一个运行平台,它能够让我们通过 HTML + CSS + JavaScript 开发桌面应用程序。
1.https://gitee.com/dmhsq/vue3-vite-electron
在团队中,我们因业务发展,需要用到桌面端技术,如离线可用、调用桌面系统能力。什么是桌面端开发?一句话概括就是:以 Windows 、macOS 和 Linux 为操作系统的软件开发。对此我们做了详细的技术调研,桌面端的开发方式主要有 Native 、 QT 、 Flutter 、 NW 、 Electron 、 Tarui 。其各自优劣势如下表格所示:
2017 年时,Electron 可以说是 Web 应用在桌面平台发布的最佳、甚至是唯一选项,但如今它却成了需要被优化淘汰的对象。
从搭建开始 使用的是electron-vue 毕竟方便一点 如果只想安装electron 请参见我的另一个文章 https://segmentfault.com/a/11...
Vite 在运行过程中,会记录每个模块间的依赖关系,所有的依赖关系,最终会汇总成一个模块依赖图。利用这个模块依赖图,Vite 能够准确地进行热更新。
将 Electron Forge 添加到您应用的开发依赖中,并使用其"import"命令设置 Forge 的脚手架
在开始之前,我想您一定会有这样的困惑:标题里的Electron 是什么?Electron能做什么?许多伟大的公司使用Electron框架的原因又是什么?
今天在浏览知乎的时候,看到这么一个问题,感觉很有意思,有点分享价值,如下: APICloud 能都替代 Android 原生开发吗? APICloud 现在好像蛮火,但是能替代比如在 Eclipse,AndroidStudio 来做的 App 开发吗?本来在 Eclipse 上做 App 开发的程序员有必要转到 APICloud 上开发吗,毕竟还是简单,快速些。 说实话,这个问题本身就问的就有问题,没有说一种技术可以完全替代另外一种技术,每种技术的侧重点和优势都不一样,不同的需求和场景,不同的体验可以选择不
之前有朋友希望我基于H5-Dooring开发一款桌面端应用, 最近刚好有时间, 就花了小半天时间从零使用electron开发了桌面端的离线软件Dooring-electron.
Electron安装安装问题npm或者yarn安装electron就算是配置了淘宝源还是会出现超时。所以我的解决方案是安装cnpm,使用cnpm去安装。 全局安装cnpm npm i cnpm -G 复制代码 新建项目 cnpm init // 一路Enter然后到最后一步输入yes // 安装dev相关依赖 cnpm i electron -D //安装electron cnpm i electron-builder -D // 用来打包客户端安装包 -- 需要下一步下一步安装来完成
需求: 我们需要创建一个动漫更新的系统通知, 当用户点击系统的通知, 就会打开相应的界面播放动漫, 这是一个Electron功能演示的文章, 所以并不涉及如何通过网络监听各大平台的动漫更新情况(当然实现的思路也是有的, 用一个爬虫程序, 定时去爬各个平台的动漫的标题目录的变化, 如果有更新, 则通过回调函数, 发出系统通知)
模块热替换 (hot module replacement 或 HMR) 是 webpack 提供的最有用的功能之一。它允许在运行时更新所有类型的模块,而无需完全刷新
什么是热更新? 不停机更新,实时更新。HotUpdateHotFix Unity中需要APP重启 真正热更新不重启就做更新
当我们明白了以上几个问题之后,那就大概率算是基本掌握了这个技术,后面再要深入就要经过大量的项目实践和源码原理的研究了。
前端爱好者的知识盛宴 嗨 这里是IMWEB 一个想为更多的前端人 享知识 助发展 觅福利 有情怀有情调的公众号 欢迎关注转发 让更多的前端技友一起学习发展~ 导语 对于大多数前端包括多终端的开发,Electron 可以开发跨平台桌面客户端,在需要开发这类产品时,是个不错的选择。 以下是我以第一视角基于 Electron 开发客户端产品的体验。 正文 Electron 是什么让 Electron 如此迷人? 可能主要是因为,猿类里的亚种——前端开发——又有了新的出路了吧,还没找工作的前端开发,又有了新的
领取专属 10元无门槛券
手把手带您无忧上云