针对mac平台的app let willQuitApp = false; // 控制退出方式 mainWindow.on('close', (e) => { if (willQuitApp) { mainWindow = null; printWindow = null; // 其他窗口也要会回收 } else { // mac平台,左上角关闭窗口 = 隐藏窗口 e.preventDefault(); mainWindow.hide(); } }); // Quit when all windo

背景 目前社区两大Vue+Electron的脚手架:electron-vue和vue-cli-plugin-electron-builder, 都有这样那样的问题,且都还不支持Vue3,然而Vue3已是大势所趋, Vite势必也将成为官方Vue脚手架, 下图是尤雨溪在开发好Vite之后与webpack之父的对话 所以开发一个Vite+Vue3+Electron的脚手架的需求日趋强烈 我前段时间做了一个, 但是发现了一些与Vite有关的问题, 比如:Vite会把开发环境的process对象吃掉的问

Electron: 使用 JavaScript, HTML 和 CSS 等 Web 技术创建原生程序的框架 Vue.js: Web 前端用于构建用户界面的渐进式框架 Vuetify: Vue.js 的 Material Design 组件框架 看完以上介绍,也明白了本文要做的事:用 Vue.js 与 Vuetify 组件,基于 Electron 来创建原生桌面应用. 环境准备 Visual Studio Code Node.js Yarn Vue CLI 创建 Vue.js 应用 添加 Vuet

前言 Electron作为一款跨平台的桌面应用端解决方案已经风靡全球.作为开发者,我们几乎不用关心与操作系统的交互,直接通过Web前端技术与Electron提供的API就可以完成桌面应用端的开发. 然而,为什么国内使用Electron的踩坑文章数不胜数,主要原因是Electron为了支持跨平台,为不同的操作系统平台进行了适配,将chromium内核与node集成到了一起,屏蔽了底层操作系统的细节,所以在不同的平台上有着不同的二进制基座.在开发的过程中,我们必须要下载对应的平台的基座,才能正常开发

新用户购买<Electron + Vue 3 桌面应用开发>,加小册专属微信群,参与群抽奖,送<深入浅出Electron>.<Electron实战>作者签名版. 1等奖:<深入浅出Electron>+<Electron实战> 2等奖:<深入浅出Electron> 3等奖:<Electron实战> 抽奖活动是掘金组织的,仅限近几日加入微信群的新成员(目前人还不多),我负责抽奖.邮寄,11月20日开始抽奖.凡参与抽奖的读者都有

如下是对窗口最大化,最小化等相关操作: import { ipcMain, ipcRenderer, remote } from 'electron' import is from 'electron-is' // ipc 通信发送的窗口状态改变事件的channel名称 export const windowStateChangeChannel = 'window-state-changed' // window的当前状态 export const WINDOW_STATE = { FULLSC

参考: 打造你的第一个 Electron 应用 首先运行下面在目录下创建package.json: $ npm init 去掉了一些无关项后内容如下: { "name": "hello", "version": "1.0.0", "description": "问好", "main": "问好.js", "scripts": {

Electron学习-快速搭建app demo 作者: 狐狸家的鱼 Github: 八至 一.安装Node 1.从node官网下载 ,最好安装.msi后缀名的文件,新手可以查看安装教程进行安装. 2.然后cmd进入命令窗口,输入npm -v查看node当前版本, 二.创建文件并初始化 1.在自己喜欢的盘里新建项目文件,我是  E:\Electron\resources\app,在此文件目录app下打开命令窗口,按住shift ,右击空白处,选择在此处打开powershell命令窗口 2.在命令窗

Electron介绍 简单来说,Electron就是可以让你用Javascript.HTML.CSS来编写运行于Windows.macOS.Linux系统之上的桌面应用的库.本文的目的是通过使用Electron开发一个完整但简单的小应用:记事本,来体验一下这个神器的开发过程.本文犹如Hello World一样的存在,是个入门级笔记,但如果你之前从未接触过Electron,而又对它有兴趣,某想信这会是一篇值得一看的入门教程. PS:这篇文章是基于Windows的开发过程,未对macOS.Linux

electron是由Github开发,是一个用Html.css.JavaScript来构建桌面应用程序的开源库,可以打包为Mac.Windows.Linux系统下的应用. 快速开始 接下来,让代码来发声,雷打不动的hello world 创建文件夹,并执行npm init -y,生成package.json文件,下载electron模块并添加开发依赖 mkdir electron_hello && cd electron_hello && npm init -y &

Electron是使用 JavaScript, HTML 和 CSS 构建跨平台的桌面应用 本文基于Windows进行开发的过程,记录下来,以便日后使用,Electron官网:https://electronjs.org/docs 1,安装node.js 进入官网下载.安装.https://nodejs.org/en/ 2,安装cnpm 安装命令(打开系统的cmd.exe来执行命令): npm install -g cnpm --registry=https://registry.npm.tao

1 开发环境:node环境 2 下载electron:npm install electron --save-dev 3 package.json配置如下: { "name": "demo", "version": "1.0.0", "description": "", "main": "index.js", "scripts"

谷歌V8引擎的出现,Node.js的诞生注定要把开发模式“搅乱”. 基于云应用,服务化,定制化的应用需求不断增加后使得传统的winform开发空间越来越小,而原来做前端的空间越来越大,Node.js 的出现,让所有做前端的同学眼前一亮,js可以写服务器啦. { "name": "myapp", "version": "1.0.0", "description": "", "ma

本章主要内容 构建并启动Electron应用 生成package.json,配置成Electron应用 在你的项目中包含预先构建Electron版本 配置package.json以启动主进程 从主进程生成渲染进程 利用Electron限制宽松的优点构建通常在浏览器无法构建的功能 使用Electron的内置模块来回避一些常见的问题 在第一章中,我们从高的层次上,讨论了什么是Electron.说到底这本书叫做<Electron实战>,对吧?在本章中,我们通过从头开始设置和构建一个简单的应用程序来管

效果展示 项目背景: 由于浏览器的限制,web批量下载体验不好以及无法下载文件夹.采用Electron技术,通过js开发PC应用程序,着力解决批量下载.断点续传.文件夹下载等问题.配合网页版网盘使用,单个小文件使用浏览器内置下载,单个大文件.多文件.文件夹调用PC应用程序,提升下载体验. 技术栈 Electron项目的目的,是为了要避免使用 vue 手动建立起 electron 应用程序.electron-vue 充分利用 vue-cli 作为脚手架工具,加上拥有 vue-loader 的 we

本章主要内容: 使用JavaScript Set数据结构跟踪多个窗口 促进主进程和多个渲染器进程之间的通信 使用Node APIs检查应用程序运行在那个平台上 现在,当Fire Sale启动时,它为UI创建一个窗口.当该窗口关闭时,应用程序退出.虽然这种行为完全可以接受,但我们通常希望能够打开多个独立的窗口.在本章中,我们将Fire Sale从一个单窗口应用程序转换为一个支持多个窗口的应用程序.在此过程中,我们将探索新的Electron APIs以及一些最近添加的JavaScript.我们还将探

我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(二): http服务器, ws服务器, 进程管理 electron教程(三): 使用ffi-napi引入C++的dll   一. 安装 1.安装node.js 从node.js官网下载 推荐下载LTS版本(当前为10.16.3), 默认安装即可.   2.安装yarn 以管理员模式启动cmd, 执行指令: npm install yarn -g 根据官网介绍, Yarn 对你的代

摘要:随着前端技术的飞速发展,越来越多的技术领域开始被前端工程师踏足.从NodeJs问世至今,各种前端工具脚手架.服务端框架层出不穷,“全栈工程师”对于前端开发者来说,再也不只是说说而已.在NodeJs及其衍生技术高速发展的同时,Nw和Electron的问世,更是为前端发展提速不少,依稀记得哪位前辈说过,“能用Js改写的,终将用Js改写”,这不,客户端来了!使用Electron也有一段时间了,各种简单复杂的问题,也都或多或少的遇见过,下决心整理出一套客户端模板出来,一是加深一下自己的理解,二是供

electron-store1可以用来保存Electron应用程序或模块的简单数据持久性-保存和加载用户首选项,应用程序状态,缓存等. 1https://github.com/sindresorhus/electron-store Electron没有内置的方法来保留用户首选项和其他数据.electron-store模块可以为您解决该问题,因此您可以专注于构建应用程序. 数据保存在app.getPath('userData')2中的JSON文件中.您可以在主进程和渲染器进程中直接使用此模块. 2

是什么? Electron是由Github开发,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并到同一个运行时环境中,并将其打包为Mac,Windows和Linux系统下的应用来实现这一目的. 为什么选择electron? 先来看一下官方的两句话 使用 JavaScript, HTML 和 CSS 构建跨平台的桌面应用 如果你可以建一个网站,你就可以建一个桌面应用程序. Electron 是一个使用 Jav

Github 官方地址 代表作: Visual Studio Code Atom - Code editor. Github开源的代码编辑器,Electron起源地 Visual Studio Code - Cross-platform IDE. 近几年最火的代码IDE Hyper - Terminal. 3万多星的命令行窗口,慌了! 其他 本章主要内容 理解Electron是什么 学习Electron基于什么技术 了解使用Electron和传统Web应用程序有什么不同 构建Electron应用