electron

首发于 酷家乐前端博客 标题是我以第一视角基于 Electron 开发客户端产品的体验，我将在之后分一系列文章向有兴趣的朋友一步一步介绍我是怎么从玩玩具的心态开始接触 Electron 到去开发客户端产品，最后随着业务和功能的复杂度提升再不断地优化客户端。 这是该系列的第一篇，我也是边学边做边反思，欢迎交流，哦，不用担心我会「太监」这个系列文章，因为我的老大握着40米大刀注视着我，不定期出下一篇（间隔最大不超3周）。 // 以下是单口相声，从第一视角讲我是怎么接触到 Electron 直到要自己去用它开发应用的，不喜欢可以跳过 Electron，小名 Atom Shell，而 Atom 是 Github 发布的一款「现代化」的文本编辑器，很多人因为看到「Atom 华丽的编辑器截图」而入坑，又纷纷因为「Atom 三分钟憋不出一个P的流畅度」而弃坑，仰天感叹「封面果然都是骗人的」，我就是其中一个，这是第一次我和 Electron 接触，但那时候我还不认识她。 后来听说微软有一款编辑器叫「VS Code」贼好用，我就又去用了下，一样华丽的「封面」，然而却异常地好用和流畅，（这里我并不想挑起两大门派战争，只是个人体验实录），那是我和 Electron 的第二次接触，我依旧不认识她。 之后又在一些博客、专栏看到过诸多 Electron 的相关的文章，大致知道这是一个新的技术框架，可以让

本文主要讲解electron如何执行使用electron-updater更新应用 1.安装electron-updater npm install electron-updater --save-dev 2.编写更新代码 const { autoUpdater } = require('electron-updater') ipcMain.on('checkForUpdate', e => updateHandle() ) // 检测更新，在你想要检查更新的时候执行，renderer事件触发后的操作自行编写 function updateHandle () { autoUpdater.checkForUpdates() const message = { error: '检查更新出错', checking: '正在检查更新……', updateAva: '检测到新版本，正在下载……', updateNotAva: '现在使用的就是最新版本，不用更新' } autoUpdater.setFeedURL('http://127.0.0.1/exe') // eslint-disable-next-line handle-callback-err autoUpdater.on('error', function (error) { sendUpdateError(JSON

本文由葡萄城技术团队于博客园原创并首发 转载请注明出处： 葡萄城官网 ，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。 在开始之前，我想您一定会有这样的困惑：标题里的Electron 是什么？Electron能做什么？许多伟大的公司使用Electron框架的原因又是什么？ 带着这些问题和疑惑，通过本文的介绍，可助您全面地认识Electron这门新兴的技术，迅速找到其入门途径，并理解Electron为何被称为当下开发桌面App的最佳选择。 初探Electron 一、Electron是什么？（为何称之为“跨平台桌面浏览器”） 前端开发的魅力，在于开发者随时要面临全新技术的挑战！ 曾几何时，作为前端开发者的你可曾想过：如何利用HTML、CSS和JavaScript构建跨平台的桌面应用程序？借助 Electron，这项工作将比你想象的更加简单。 Electron作为一个使用新兴技术（包括JavaScript，HTML和CSS）创建桌面应用程序的框架，其负责处理硬件，开发者可以更专注于应用程序的核心并从底层更改其设计。 Electron设计之初便充分结合了当今最好的Web技术，作为一个跨平台的“集成框架”，它可以轻松地与Mac、Windows和Linux兼容。而所谓的“集成框架”也就是它将“Chromium”和“Node.js”很好的集成在了一起，并明确分工

关于electron Electron是由Github开发，用HTML，CSS和JavaScript来构建跨平台桌面应用程序的一个开源库。 Electron通过将Chromium和Node.js合并到同一个运行时环境中，并将其打包为Mac，Windows和Linux系统下的应用来实现这一目的，下面直接上代码。 基础代码 基础目录结构 electron-demo/ ├── app ├─── index.html ├─── icon.icns ├── package.json ├── main.js package.json 跟常规 Node 程序一样，将 main.js 作为 程序的启动入口文件 { "name": "electron-demo", "version": "1.0.0", "description": "测试electron打包以及跟html5通信", "main": "main.js", "scripts": { "start": "electron .", "packager:os": "electron-packager ./ XXX教师端-非官方 --platform=darwin --out ./outApp --overwrite --icon=./app/icon.icns", "packager:win64": "electron-packager .

安装electron 上次安装node-sass即使用了淘宝镜像源也还是安装不上（ 解决方法 ），这次又遇到了一个用镜像源也安装不上的 就是electron，安装在某一点卡死，一直不动 原因是这样的：因为 npm 需要连接 github 下载 electron 安装包导致，安装包有 60M 左右，但从 github 下载却只有几 KB，所以感觉是卡住了。但改使用淘宝的 cnpm 发现还是会卡住，这是因为 electron 的包默认还是指向 github 下载，所以需要修改下载地址的环境变量electron_mirror，这是由electron 提供的 npm config set electron_mirror http://npm.taobao.org/mirrors/electron/ 执行了修改操作后可以安装上了，但是汇报一个404错误，导致安装失败，并且显示了从哪个网址下载失败，经对比是这样的 淘宝镜像的： http://npm.taobao.org/mirrors/electron/8.1.1/ 404报的地址： http://npm.taobao.org/mirrors/electron/v8.1.1/ 仅仅是多了个 v ,所以还需要加一步 electron 官方也提供了修改目录名称的环境变量 electron_custom_dir npm config set

自定义NodeJS-C++ Addons使用说明 Windows 流程 Step.01 编译环境搭建 参照 Github-nodejs/node-gyp 使用选择： windows-build-tools 注意，需要使用管理员权限打开cmd等 Visual Studio Build Tools 或下载完整的Visual Studio（其中也需要包含对应的build tool） 安装对应的Python版本（node-gyp支持的Python版本为v2.7/3.5/3.6/3.7），可使用npm config set python /path/to/executable/python 设置python。 Step.02 C++代码实现 此部分官方有详细的介绍说明，本提交中的hello.cc代码即从官方代码拷贝而来: Node.js v12.16.1 Documentation Node.js v12.16.1 文档 Step.03 Electron环境编译C++代码 原生代码相关依赖于V8引擎，不同版本的Electron可能有些区别，需要匹配对应版本，可以使用electron-rebuild自动管理，或手动管理： 生成配置： node-gyp configure --target=2.0.8 --arch=x64 --dist-url=https://npm.taobao.org

本文主要讲解electron如何执行cmd命令 通常我们有些功能是需要借助外部程序才能完成的，例如通过我们写的electron启动nginx或者获取本机的一些信息。 执行cmd命令不需要安装额外的依赖，使用node的child_process模块即可完成这个功能。 1.引用child_process模块 import { exec } from 'child_process' 2.执行CMD命令 这里我们执行一下windows常用命令ipconfig，使用child_process执行cmd命令是可以指定执行的目录的（cmdPath） // 任何你期望执行的cmd命令，ls都可以 const cmdStr = 'ipconfig' // 执行cmd命令的目录，如果使用cd xx && 上面的命令，这种将会无法正常退出子进程 const cmdPath = pathUtil.getAppResourcePath('') // 执行命令行，如果命令不需要路径，或就是项目根目录，则不需要cwd参数： const workerProcess = exec(cmdStr, { cwd: cmdPath }) // 不受child_process默认的缓冲区大小的使用方法，没参数也要写上{}：workerProcess = exec(cmdStr, {}) // 打印正常的后台可执行程序输出