当前位置: 首页 > news >正文

01_Electron 跨平台桌面应用开发介绍

Electron 跨平台桌面应用开发介绍

  • 一、Electron 的介绍
  • 二、关于 NW.js 和 Electron 介绍
  • 三、搭建 Electron 的环境
    • 1、准备工作:
    • 2、安装 electron 环境
    • 3、查看 electron 的版本,`electron -v`

一、Electron 的介绍

Electron 是由 Github 开发的一个跨平台的桌面应用开发框架,可以让我们用 html、css、js 的技术开发桌面上可以安装的软件。
使用传统语言开发桌面应用,开发成本高。

github 的 atom 编辑器,vscode都是使用 Electron 开发的。

如果由下面的需求建议学一下 Electron:
1、公司有开发桌面应用的需求。(Electron 开发速度快、开发周期短、跨平台、维护成本低)
2、前端开发者想提升自己的技能,有必要学习一下 Electron, 大家都会 Electron, 所以我们也得学。(我们不知道,不代表别人也不知道)
3、开发开源软件,推广自己的产品(如 atom、vscode 编辑器)
4、同样的功能,开发软件比开发网站更赚钱。(网站:4k-5w, app:5w-50w, 桌面软件:2w-50w)

二、关于 NW.js 和 Electron 介绍

NW.js 和 Electron 都可以用前端的知识来开发桌面应用。NW.js 和 Electron起初是同一个作者开发。后来种种原因分为两个产品。一个命名NW.js(英特尔公司提供技术支持)、另一个 命名为 Electron (Github 公司提供技术支持)。

NW.js 和 Electron 可以用 Nodejs 中几乎所有的模块。NW.js 和 Electron 不仅可以把 html 写的 web 页面打包成跨平台可以安装到电脑上面的软件,也可以通过 JavaScript 访问操作系统原生的 UI 和API(控制窗口、添加菜单项目、托盘应用菜单、读写文件、访问剪切板)。
目前用的比较多的还是 Electron。

三、搭建 Electron 的环境

1、准备工作:

1、电脑必须安装 Nodejs。当前我的 node 版本是 v14.18.0
2、电脑上推荐安装 git

2、安装 electron 环境

npm install -g electron

或者

cnpm install -g electron

3、查看 electron 的版本,electron -v

![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/39f3068c5bd94b06b538fddcb88cc534.png

相关文章:

01_Electron 跨平台桌面应用开发介绍

Electron 跨平台桌面应用开发介绍 一、Electron 的介绍二、关于 NW.js 和 Electron 介绍三、搭建 Electron 的环境1、准备工作:2、安装 electron 环境3、查看 electron 的版本,electron -v 一、Electron 的介绍 Electron 是由 Github 开发的一个跨平台的…...

【C语言-扫雷游戏】mineweeper【未完成】

编程小白如何成为大神?大学新生的最佳入门攻略 编程已成为当代大学生的必备技能,但面对众多编程语言和学习资源,新生们常常感到迷茫。如何选择适合自己的编程语言?如何制定有效的学习计划?如何避免常见的学习陷阱&…...

psychopy stroop 实验设计

斯特鲁stroop实验就是色词一致/不一致实验。 设计步骤如下: 1. 先去设置中将Input改为PsychToolbox, 2. 然后左上角File-New新建一个 3. 右键trial,rename改名 改成自己想要的名字即可,比如欢迎界面welcome。 4. 接下来添加提示语…...

c++精品小游戏(无错畅玩版)

一、俄罗斯方块 #include <stdio.h> #include <string.h> #include <stdlib.h> #include <time.h> #include <conio.h> #include <windows.h>#ifdef _MSC_VER // M$的编译器要给予特殊照顾 #if _MSC_VER < 1200 // VC6及以下版本 #err…...

应急响应-主机安全之系统及进程排查相关命令(Linux操作系统-初级篇)

目录 概述lscpu-显示有关CPU架构的信息uname-查看系统信息lsmod-输出加载的所有模块lastb-输出最后登录失败的用户last-展示用户最近登录信息lastlog-展示所有用户最后的登录时间systemctl-系统服务&#xff0c;开机自启排查crontab-计划任务选项 history-查看历史命令选项常用…...

java中RSA分段加解密及Data must not be longer than异常处理

谈到RSA非对称加密&#xff0c;作为开发的我们第一想到的是安全&#xff0c;几乎不会被破解&#xff0c;以及公钥加密&#xff0c;私钥解密这些。在Java代码中&#xff0c;我们常使用一些现成的工具类如hutool中提供的工具类、网上在线的或者博客上的RSAUtils工具类来实现公钥私…...

MySQL数据分析进阶(十二)设计数据库——PART3

※食用指南&#xff1a;文章内容为‘CodeWithMosh’SQL进阶教程系列学习笔记&#xff0c;笔记整理比较粗糙&#xff0c;主要目的自存为主&#xff0c;记录完整的学习过程。&#xff08;图片超级多&#xff0c;慎看&#xff01;&#xff09; 【中字】SQL进阶教程 | 史上最易懂S…...

Kubernetes-1.22.0 可视化部署

目录 Kubeadm方式部署3master&#xff0c;2work集群&#xff08;Kubernetes-1.22.0&#xff09;-CSDN博客 1. 官方Dashboard 2. Kuboard 部署 3. Rainbond 部署 4. Kubesphere 部署 1. 官方Dashboard kubectl apply -f https://kuboard.cn/install-script/k8s-dashboard/v2…...

在 vue3 中动态路由问题记录

第一种 如果这样子的话需要加上 /* vite-ignore / ,但是在这样用这行部署服务器上跳转会有问题 component: () > import(/ vite-ignore */ ../views/ e.component .vue) 第二种 // 解决跳转问题const modeules imporet.meta.glob(/views/**/**.vue)component: modules…...

进程编程及其函数的使用

1. 创建进程 创建进程的核心操作是使用 fork() 系统调用。 1.1 fork() 系统调用 fork() 创建一个新进程&#xff08;子进程&#xff09;&#xff0c;新进程几乎是父进程的完整拷贝。fork() 返回两次&#xff1a; 在父进程中&#xff0c;返回子进程的 PID。在子进程中&#…...

为什么funnel图在邮件中不显示

在电子邮件中嵌入的Funnel图或其他图表可能不显示的原因有以下几种&#xff1a; 1. 邮件客户端对外部内容的限制 大多数邮件客户端为了安全&#xff0c;会阻止从外部服务器加载的内容&#xff0c;如图片、脚本或嵌入式图表。Funnel图通常是通过链接或外部脚本生成的&#xff…...

C语言 ——— 写一个函数,判断一个字符串是否为另外一个字符串旋转之后的字符串

目录 题目要求 代码思路 代码实现 题目要求 写一个函数&#xff0c;判断一个字符串是否为另外一个字符串旋转之后的字符串 例如 s1 "AABCD" &#xff1b;s2 "BCDAA" &#xff0c;返回1 s1 "AABcd" &#xff1b;s2 "BCDAA" …...

白骑士的Matlab教学实战项目篇 4.4 机器学习与AI

系列目录 上一篇&#xff1a;白骑士的Matlab教学实战项目篇 4.3 控制系统设计 机器学习与人工智能&#xff08;AI&#xff09;是当前技术发展的前沿领域&#xff0c;通过数据驱动的模型和算法&#xff0c;可以解决许多复杂的问题。MATLAB 提供了丰富的工具和函数&#xff0c;支…...

事件监控模块——Channel模块

这个模块就是 记录文件描述符 和 想要监控的事件&#xff0c;实际就绪的事件&#xff0c;以及事件发生之后要怎么做&#xff0c;判断有没有监控这个事件&#xff0c;获取事件。 class Poller; class EventLoop; class Channel {private:int _fd;EventLoop *_loop;uint32_t _ev…...

OCR调研

OCR调研 一、介绍 OCR&#xff08;Optical Character Recognition&#xff0c;光学字符识别&#xff09;是一种将图像中的文字转换为计算机可处理格式的技术。OCR技术经历了从传统OCR到基于深度学习的OCR的转变。深度学习OCR技术通过模拟人脑神经元结构处理文本和图像数据&am…...

数据结构(学习版)

考纲 (一)数据结构部分; 线性表栈、队列、数组查找和内部排序树和图 (二)计算机算法设计部分: 递归与分省策路、回溯法贪心算法、分支限界法、动态规划算法设计中的数据结构运用 (三)程序设计基础(C或C)部分: 基本数据类型、各种运算符和表达式、基本控制结构。数组的定义…...

除了知云文献翻译外,这几款翻译工具值得推荐!

近年来&#xff0c;市面上涌现出众多优秀的文献翻译工具&#xff0c;其中知云文献翻译凭借其强大的功能受到了广泛好评。然而&#xff0c;除了知云文献翻译外&#xff0c;还有几款翻译工具同样值得推荐。今天&#xff0c;就让我们一起来了解一下&#xff01; Foxit在线翻译 链…...

Element UI动态实现面包屑导航~

思路&#xff1a;监听路由变化&#xff0c;在路由规则中添加meta然后在组件中渲染。 import Vue from "vue" import VueRouter from "vue-router" Vue.use(VueRouter) // 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题 const origin…...

安科瑞Acrel-2000ES储能能量管理系统在新型电力系统下分布式储能的研究

摘要&#xff1a;传统电力系统的结构和运行模式在以新能源为主体的新型电力系统中发生了巨大的变化&#xff0c;分布式储能作为电力系统中重要的能量调节器&#xff0c;也迎来了新的发展机遇。立足于储能技术发展现状&#xff0c;分析了分布式储能技术特点及在清洁可再生能源方…...

Git 逆转时光:版本回退操作详解

git 版本回退操作详解 一、Git的工作流程二、git clean尚未 commit 的修改三、已经 commit 尚未 push 到 remote 仓库四、已经提交到 remote 仓库五、回退建议六、总结 一、Git的工作流程 在讲这个版本回退之前&#xff0c;我们要温习一下Git的原理。下面这张图就是 Git 的整个…...

深度学习在微纳光子学中的应用

深度学习在微纳光子学中的主要应用方向 深度学习与微纳光子学的结合主要集中在以下几个方向&#xff1a; 逆向设计 通过神经网络快速预测微纳结构的光学响应&#xff0c;替代传统耗时的数值模拟方法。例如设计超表面、光子晶体等结构。 特征提取与优化 从复杂的光学数据中自…...

1688商品列表API与其他数据源的对接思路

将1688商品列表API与其他数据源对接时&#xff0c;需结合业务场景设计数据流转链路&#xff0c;重点关注数据格式兼容性、接口调用频率控制及数据一致性维护。以下是具体对接思路及关键技术点&#xff1a; 一、核心对接场景与目标 商品数据同步 场景&#xff1a;将1688商品信息…...

Cloudflare 从 Nginx 到 Pingora:性能、效率与安全的全面升级

在互联网的快速发展中&#xff0c;高性能、高效率和高安全性的网络服务成为了各大互联网基础设施提供商的核心追求。Cloudflare 作为全球领先的互联网安全和基础设施公司&#xff0c;近期做出了一个重大技术决策&#xff1a;弃用长期使用的 Nginx&#xff0c;转而采用其内部开发…...

Angular微前端架构:Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

Rust 开发环境搭建

环境搭建 1、开发工具RustRover 或者vs code 2、Cygwin64 安装 https://cygwin.com/install.html 在工具终端执行&#xff1a; rustup toolchain install stable-x86_64-pc-windows-gnu rustup default stable-x86_64-pc-windows-gnu ​ 2、Hello World fn main() { println…...

【LeetCode】算法详解#6 ---除自身以外数组的乘积

1.题目介绍 给定一个整数数组 nums&#xff0c;返回 数组 answer &#xff0c;其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法&#xff0c;且在 O…...

sshd代码修改banner

sshd服务连接之后会收到字符串&#xff1a; SSH-2.0-OpenSSH_9.5 容易被hacker识别此服务为sshd服务。 是否可以通过修改此banner达到让人无法识别此服务的目的呢&#xff1f; 不能。因为这是写的SSH的协议中的。 也就是协议规定了banner必须这么写。 SSH- 开头&#xff0c…...

Java详解LeetCode 热题 100(26):LeetCode 142. 环形链表 II(Linked List Cycle II)详解

文章目录 1. 题目描述1.1 链表节点定义 2. 理解题目2.1 问题可视化2.2 核心挑战 3. 解法一&#xff1a;HashSet 标记访问法3.1 算法思路3.2 Java代码实现3.3 详细执行过程演示3.4 执行结果示例3.5 复杂度分析3.6 优缺点分析 4. 解法二&#xff1a;Floyd 快慢指针法&#xff08;…...

OCR MLLM Evaluation

为什么需要评测体系&#xff1f;——背景与矛盾 ​​ 能干的事&#xff1a;​​ 看清楚发票、身份证上的字&#xff08;准确率>90%&#xff09;&#xff0c;速度飞快&#xff08;眨眼间完成&#xff09;。​​干不了的事&#xff1a;​​ 碰到复杂表格&#xff08;合并单元…...

React核心概念:State是什么?如何用useState管理组件自己的数据?

系列回顾&#xff1a; 在上一篇《React入门第一步》中&#xff0c;我们已经成功创建并运行了第一个React项目。我们学会了用Vite初始化项目&#xff0c;并修改了App.jsx组件&#xff0c;让页面显示出我们想要的文字。但是&#xff0c;那个页面是“死”的&#xff0c;它只是静态…...