Building Desktop Applications with Electron Jfokus 2018 Catalin Fratila @catalinfratila ## Roadmap • What is Electron? • My first Electron App • Features – Electron API • Missing functionality? • • Security • Microsoft and Electron • Future of Electron • Pros and Cons ## Roadmap I'VE LOST AN ELECTRON! ARE YOU POSITIVE?  IN FACT, I'M POSITIVE ## About ## ☀ ELECTRON • Open source framework and runtime • 2013 – Atom Shell • Chromium, Node.JS ![Image](/uploads/documents/5/e/4/1/5e41a0137aed5

electron中文教程 书栈(BookStack.CN) ## 目录 致谢 向导 支持平台 分发应用 提交应用到 Mac App Store 打包应用 使用 Node 原生模块 主进程调试 使用 Selenium 和 WebDriver 使用开发人员工具扩展 使用 Pepper Flash 插件 node-场合）在技术上的差异 构建系统概览 构建步骤 (macOS) 构建步骤 (Windows) 构建步骤 (Linux) 在调试中使用 Symbol Server ## Electron 常见问题 ## 致谢 当前文档《electron中文教程》由进击的皇虫使用书栈(BookStack.CN)进行构建，生成于2019-03-06。 书栈(BookStack.CN) 仅提供文档编写、整理、归类等功能，以及对文档内容的生成和导出工具。 CN)获取最新的文档，以跟上知识更新换代的步伐。 内容来源：weishuai https://weishuai.gitbooks.io/electron-/content/ 文档地址：http://www.bookstack.cn/books/electron-zh 书栈官网：http://www.bookstack.cn 书栈开源：https://github.com/TruthHun

## 目录 前言 1.1 Electron简介 1.2 应用举例 1.2.1 安装 1.3 基本使用 1.4 打包和部署 1.5 python支持 1.6 心得 1.7 开发 1.7.1 Web技术 1.7.1.1 Log日志 1.7.1.2 打包 1.7.2 制作app的Logo 1.7.2.1 2.2 files 1.7.2.3 electron-builder 1.7.2.4 electron-rebuild 1.7.2.5 不同系统 1.7.3 Win 1.7.3.1 Mac 1.7.3.2 不同语言 1.7.4 Python 1.7.4.1 electron-python-example 1.7.4.1.1 electron和node版本对应关系 1.7.5.1 NODE_MODULE_VERSION和node版本对应关系 1.7.5.2 附录 1.8 文档和教程 1.8.1 参考资料 1.8.2 ## 跨平台桌面应用框架：Electron 最新版本：v1.0 • 更新时间：20200808 ## 简介 介绍跨平台桌面应用框架Electron的基本概念

# 基于Electron Vue的桌面应用开发实践 美团 美团点评  ## 赵帅 ## 前端工程师 @美团点评-到店事业群 负责-度假业务系统工程化 瓦匠桌面应用开发者 01 瓦匠应用的介绍 02 桌面应用的技术选型 03 Electron Electron Vue项目实践 04 桌面应用开发总结 ## 应用介绍 瓦匠 瓦匠工作台 一体化解决方案 提高开发效率 打开工程 全部 < 收起 其他 标签 使用 使用  标签 标签 使用 @hfe/tiler-query-table4 可视化编辑 模板的编译 命令的调用 ☐ ☐ ☐ ☐ Web开发能力不足 命令行无法可视化 (GUI界面) 桌面应用 01 瓦匠应用的介绍 02 桌面应用的技术选型 03 Electron Vue项目实践 04 桌面应用开发总结 ## 技术选型 ## 桌面应用开发选型 ![Image](/uploads/documents/7/5/0/8/750830e35b58f1e

title: Electron 应用处理长任务 date: 2020-11-26 tags: electron, node ## description: 通过 Electron 托盘（tray）实现后台执行长任务。 Electron 应用在执行一些长时间任务（比如上传、下载），我们想关闭界面后任务依旧执行。再次打开界面，依旧可以看到正在执行的任务以及任务进度。托盘可以帮我们实现这个功能。 能。 ## 创建托盘和菜单示例 • 实例化 Tray 并传入图标路径； • 创建菜单并配置到托盘中。 const { app, Menu, Tray } = require('electron') let tray = null; // 等同 app.on('read', () => { ... }) app.whenReady().then(() => (mainWindow.isVisible()) { // 修复全屏 hide 黑屏问题 // https://github.com/electron/electron/issues/20263 if (mainWindow.isFullScreen()) { mainWindow

max flexibility (request, callback) => { /* ... */ } ## electron target • Compile applications for electron • webpack knows about electron native modules ## • Automatically selects correct way of of chunk loading for Code Splitting target: "electron-main" target: "electron-renderer" ### node.js target • Bundle node.js applications • Use cases: Faster startup, loaders, custom resolving

|Desktop SDK|Description|SDK code|Example code| |---|---|---|---| |Electron SDK|For Electron apps|casdoor-js-sdk|casdoor-electron-example| |.NET Desktop SDK|For .NET desktop apps|casdoor-dotnet-sdk|WPF: switching Vue versions, please refer to the vue-demi docs. ## Desktop SDKs Electron App Example for Casdoor This is an Electron app example that demonstrates Casdoor's integration capabilities. dotNET daeea/p77_2.jpg) ## Qt Desktop App A Qt desktop app example for Casdoor # Electron App Example for Casdoor An Electron app example that demonstrates Casdoor's integration capabilities. ## How

（比如 IOS、安卓、windows）。 最常见的 webview 开发解决方案如下： • Cordova (通常用于手机、平板的原生应用) - NW.js (通常用于桌面应用) • Electron (通常用于桌面应用) ## 基于 WEB 技术的原生应用 最终，前端开发者从 WEB 浏览器开发中得到经验，并可以脱离浏览器引擎环境编码。近来，人们正在构思如何脱离 web 引擎，用 web 理所应当地吸收更多追随者。 • JavaScript 函数式编程和模式备受关注。 - 离线开发和渐进式 WEB 应用（PWA）步入主流。 · 微软发力。 - 基于 web 技术，使用 NW.js 和 Electron 开发 windows，OSX 和 linux 原生应用的方式逐渐成型。 - Angular 2（在将来也叫作"Angular"）跌下神坛，多数人意识到它将不再如 Angular WebView／浏览器标签（想想 iframe）。通常 WebView 应用包含用 web 技术（也就是 HTML、CSS 和 JS）构造的 UI。（例如：Apache Cordova、NW.js、Electron） - web 技术构建的原生应用，该类 web 技术被整合在含原生 API 桥梁的运行环境中。其 UI 使用原生部分（比如 IOS 原生控件）而非 web 技术(例如: NativeScript、React

## 硅量子点 These "artificial atoms" are made by adding an electron to a small piece of pure silicon. Microwaves control the electron's quantum state. Longevity (seconds) 0.03 Logic success rate industry. Cons Only a few entangled. Must be kept cold. A nitrogen atom and a vacancy add an electron to a diamond lattice. Its quantum spin state, along with those of nearby carbon nuclei, can be controlled

PLATFORM SPECIFIC NIVES CRIPT REACT NATIVE IONIC 2 RENDER ER NATIVE VISUAL TREE PLATFORM SPECIFIC ELECTRON RENDERER DESK TOP TREE ↑ ## BUSINESS LOGIC CODE SHARING ANDROID APP  ↑ NATIVESCRIPT / REACT NATIVE / IONIC 2 ↑ MOBILE UI DEFINITION ↑ DESKTOP APP ↑ ELECTRON DESIGN UI DEFINITION N ![Image](/uploads/documents/8/d/b/9/8db9ac5bcc659b52c457ba0296861a31/p52_3