
Electron
文章平均质量分 80
有蝉
文章有用的话,请点个赞啊
展开
-
Electron学习笔记(一)—— 跨平台桌面应用开发介绍
Electron是一个跨平台的桌面应用开发框架,用html css js的技术开发桌面上面可以安装的软件,可以让我们前端人员用html css js的技术开发跨平台可以安装的桌面软件。Electron于2013年作为构建Atom的框架而被开发出来,这两个项目在2014春季开源。(Atom:为GitHub上可编辑的文本编辑器)为什么要学习Electron?1. 有桌面应用的需求。 (...原创 2020-03-27 11:13:17 · 1223 阅读 · 1 评论 -
Electron学习笔记(二)—— 环境搭建 【利用git克隆或利用electron-forge】
一、安装electroncnpm i -g electron二、创建项目法一:通过git克隆项目# 克隆示例项目的仓库git clone https://github.com/electron/electron-quick-start#进入这个仓库cd electron-quick-start#安装依赖并运行npm inpm start法二:通过 e...原创 2020-03-27 11:57:22 · 2050 阅读 · 0 评论 -
Electron学习笔记(三)—— 环境搭建 【手动搭建】
步骤step1:新建一个文件夹step2:新建一个index.html 和一个main.jsstep3:npm init 生成一个package.jsonnpm init --yes 注意:package.json里面配置的main属性的值 必须是main.js...原创 2020-03-27 12:08:47 · 364 阅读 · 0 评论 -
Electron学习笔记(四)—— 主进程渲染进程 读取文件完整 通过nodejs读取本地文件 开启调试模式
Electron运行流程Electron主进程和渲染进程主进程和渲染器进程: Electron 运行 package.json 的main 脚本的进程被称为主进程。在主进程中运行的脚本通过创建web页面来展示用户界面。一个Electron应用总是有且只有一个主进程。 由于Electron使用了Chromium ( 谷歌浏览器 ) 来展示web页...原创 2020-03-27 19:24:19 · 3528 阅读 · 0 评论 -
Electron学习笔记(五)—— 调试小技巧【上】
渲染进程 debugger主进程debuggerstep1:命令行开关:--inspect = [port]例如:electron --inspect=5858 your/appstep2:重启项目 出现问题step3:打开浏览器输入:chrome://inspectstep3:再次重启项目在浏览器中点击下图中的 i...原创 2020-03-31 16:19:56 · 1332 阅读 · 0 评论 -
Electron学习笔记(六)—— 调试小技巧【下】主进程调试方法二
主进程debugger 方法二在vscode的launch.json文件加入以下配置{ "version": "0.2.0", "configurations": [ { "name": "Debug Main Process", "type": "node", "request": "launch", "cwd"...原创 2020-04-02 09:25:14 · 679 阅读 · 0 评论 -
Electron学习笔记(七)—— 常用api____事件
asgd原创 2020-04-02 09:42:31 · 841 阅读 · 0 评论 -
Electron学习笔记(九)—— 常用api____File对象
在文件系统中,使用HTML5File原生API操作文件DOM的文件接口提供了关于原生文件的抽象,以便用户可以直接使用HTML5文件API处理原生文件。 Electron已经向文件接口添加了一个path属性, 在文件系统上暴露出文件的真实路径示例:获取拖拽到app上的文件的真实路径<div id="holder"> Drag your file here...原创 2020-04-03 08:46:48 · 995 阅读 · 0 评论 -
Electron学习笔记(十)—— 常用api____webview
webview标签用于集成 'guest(访客)' 内容(比如外部的网页)在你的 Electron 应用内。它们类似于iframe,但是不同的是每个 webview 运行在独立的进程中。 作为页面它拥有不一样的权限并且所有的嵌入的内容和你应用之间的交互都将是异步的。 这将保证你的应用对于嵌入的内容的安全性。webview 是 行内元素 <webview src="https:...原创 2020-04-03 10:00:59 · 2615 阅读 · 0 评论 -
Electron学习笔记(十一)—— 常用api____window.open和BrowserWindowProxy
window.open函数打开一个新窗口并加载 URL。当调用window.open以在网页中创建新窗口时,将为url创建一个新的BrowserWindow实例,并返回一个代理至window.open以让页面对其进行有限的控制。该代理具有有限的标准功能,与传统网页兼容。要完全控制新窗口,你应该直接创建一个BrowserWindow。默认情况下, 新创建的Br...原创 2020-04-03 18:12:20 · 3457 阅读 · 0 评论 -
Electron学习笔记(十二)—— 常用api____BrowserWindow
BrowserWindow创建和控制浏览器窗口。进程:主进程// 在主进程中.const { BrowserWindow } = require('electron')// 或者从渲染进程中使用 `remote`.// const { BrowserWindow } = require('electron').remotelet win = new BrowserWi...原创 2020-04-07 11:15:47 · 2406 阅读 · 0 评论 -
Electron学习笔记(十三)—— 常用api____BrowserView【和webview非常像的一个东西,是可以相互替换的】
类: BrowserView创建和控制视图进程:主进程BrowserView被用来让BrowserWindow嵌入更多的 web 内容。 它就像一个子窗口,除了它的位置是相对于父窗口。 这意味着可以替代webview标签.示例// 在主进程中.const { BrowserView, BrowserWindow } = require('electron')...原创 2020-04-07 12:05:30 · 4378 阅读 · 0 评论 -
Electron学习笔记(十四)—— 常用api____dialog
https://www.electronjs.org/docs/api/dialog对话框显示用于打开和保存文件、警报等的本机系统对话框。在Electron的主线程上打开const { dialog } = require('electron')console.log(dialog.showOpenDialog({ properties: ['openFile', 'mu...原创 2020-04-07 14:39:56 · 1139 阅读 · 0 评论 -
Electron学习笔记(十五)—— 常用api____系统快捷键
https://www.electronjs.org/docs/api/global-shortcut系统快捷键在应用程序没有键盘焦点时,监听键盘事件。线程:主线程globalShortcut模块可以在操作系统中注册/注销全局快捷键, 以便可以为操作定制各种快捷键。注意:快捷方式是全局的; 即使应用程序没有键盘焦点, 它也仍然在持续监听键盘事件。 在应用程序模块发出r...原创 2020-04-07 15:43:25 · 1004 阅读 · 0 评论 -
Electron学习笔记(十六)—— 常用api____主进程与渲染进程通信
https://www.electronjs.org/docs/api/ipc-mainipcMain从主进程到渲染进程的异步通信。线程:主线程TheipcMainmodule is anEvent Emitter. 当在主进程中使用时,它处理从渲染器进程(网页)发送出来的异步和同步信息。 从渲染器进程发送的消息将被发送到该模块。https://www.elec...原创 2020-04-07 17:39:33 · 623 阅读 · 0 评论 -
Electron学习笔记(八)—— 常用api____进程事件
进程事件是nodejs的所以需要在main.js中配置 nodeIntegration:true然后就可以使用nodejs中的全局对象 processconsole.log(process.env)/*process.version:包含当前node实例的版本号;process.installPrefix:包含安装路径;process.platform:列举...原创 2020-04-02 18:26:17 · 1066 阅读 · 0 评论 -
Electron学习笔记(十七)—— 常用api____原生应用菜单Menu
主进程很少有需求需要弹出菜单,所以以下代码怕是没有用//主进程很少有需求需要弹出菜单const {Menu} = require('electron')setTimeout(()=>{ //如何在主进程中弹出菜单let template = [ {label:'第一个菜单项目'}, {label:'第二个菜单项目'}, {role:'copy'}, ...原创 2020-04-08 09:06:55 · 1146 阅读 · 0 评论 -
Electron学习笔记(十八)—— 常用api____网络
网络使用Chromium的原生网络库发出HTTP / HTTPS请求进程:主进程net模块是一个发送 HTTP(S) 请求的客户端API。 它类似于Node.js的HTTP和HTTPS模块 ,但它使用的是Chromium原生网络库来替代Node.js的实现,提供更好的网络代理支持。下面是一个非详尽的列表, 用于说明为什么使用net模块而不是原生Node. js 模...原创 2020-04-08 10:07:19 · 1325 阅读 · 2 评论 -
Electron学习笔记(十九)—— 与vue集成
step1:下载实例工程electron-react-start 为自定义项目名称,可以自行更改git clone --depth 1 --single-branch --branch master https://github.com/electron-react-boilerplate/electron-react-boilerplate.git electron-react-s...原创 2020-04-08 14:01:24 · 469 阅读 · 0 评论