Electron[2] Electron使用准备

1 背景

        介绍一个技术栈的入门基础,往往要以该技术栈的入门案例作为开始比较合适,更能诱惑到刚需的粉丝,深度的学习。Electron的入门也不例外。在入门案例的讲解过程中,我们会学习到Electron引入需要的准备工作有哪些。

2 入门案例

        入门案例比较简单,就是直接将hello wolrd的静态网页打包成一个桌面应用。

2.1 软件

        使用Vscode来操作

2.2 依赖

        默认用户本地已经安装了Node环境,按照官方的说法,最新的Electron需要本地安装最新的Node稳定版本。所以如果本地不是最新版的Node的话,请升级。

        注:我一直使用的是免安装方式来使用Node的,所以,我只需要下载最新版本的Node下来,重新生成nvm的快捷连接即可。这个过程你们可能会遇到如下问题:

Node切换版本-CSDN博客

2.3 配置镜像

        正式下载Electron之前,需要配置electron的镜像地址,因为国内不好下,因此需要在.npmc里头添加如下配置:

# 使用国内的镜像地址下载electron
ELECTRON_MIRROR = "https://npmmirror.com/mirrors/electron/"
# 使用国内的镜像地址下载electron-builder
ELECTRON_BUILDER_BINARIES_MIRROR=https://npmmirror.com/mirrors/electron-builder-binaries/

2.4 安装Electron

        本地新建一个空文件夹,作为项目的文件夹,然后使用vscode打开该文件夹。然后在vscode的terminal终端上,执行如下命令:

npm init -y

 执行完之后,自动就有了node项目需要的相关配置文件了。

再执行如下命令:

npm install --save-dev electron

执行完之后,安装的版本如下:

"electron": "^27.0.2"

以前经历过一些教训,就是前端的发展可谓日新月异,经常有网友看到我的文章,但是发现没办法直接解决他们的问题,其实就是因为依赖包版本的更新,导致语法的迥异。因此附上版本号,就是告知,这篇博客仅针对这个版本的。

2.5 安装打包工具

打包工具选用Electron Forge。当然还有其他的选择像Electron builder,这个等后面再说。目前先考虑Electron Forge。

2.5.1 Git检查

由于Electron Forge依赖Git,所以需要实现安装好Git,如果没有安装的,请先安装。

Git

2.5.2 安装Electron Forge

将 Electron Forge 添加到您应用的开发依赖中

npm install --save-dev @electron-forge/cli

安装的版本号如下:

"@electron-forge/cli": "^6.4.2",
 2.5.2.1 设置Forge脚手架

使用其"import"命令设置 Forge 的脚手架

npx electron-forge import

设置日志:

npx electron-forge import
✔ Checking your system
✔ Locating importable project
✔ Processing configuration and dependencies✔ Installing dependencies✔ Copying base template Forge configuration✔ Fixing .gitignore
✔ Finalizing import› We have attempted to convert your app to be in a format that Electron Forge understands.Thanks for using…

新增配置,import之后package.json的script节点自动多了几行配置:

 "start": "electron-forge start","package": "electron-forge package","make": "electron-forge make"

至此,准备工作就做好了。

下一篇介绍,入门案例打包。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/130959.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

量化、蒸馏、分解、剪枝

量化、蒸馏、分解和剪枝都是用于深度学习模型压缩和优化的算法。 量化是一种用于减少深度学习模型计算量和内存消耗的技术。在深度学习中,模型通常使用高精度的浮点数表示参数和激活值,但这种表示方式会占用大量的内存和计算资源。而量化技术通过降低参数…

操作系统学习笔记(学习中)

计算机系统概述 1.操作系统概念 管理系统软/硬件资源,为程序提供服务 2.发展与分类 3.操作系统的运行环境 运行机制 指令:(二进制机器指令),CPU能识别,执行的最基本命令 应用程序:程序员写…

Splunk 创建特色 dashboard 报表

1: 背景: 对原有的dashboard 进行增加点东西,特别是文字部分: 比如: 增加:“this is a guidline for how to use performance". 这段话,就不能写在title, 那样,这段文字,会出现在dashboard 的PDF 文件的分割线的上面,不符合要求。 2: 解决问题: 正确的做法是…

Why delete[] array when deepcopying with “=“?

代码负责释放对象之前已经分配的资源,比如堆上的内存。在执行深拷贝之前,你需要确保对象不再引用之前的资源,以避免内存泄漏。通过删除先前的资源,你可以确保在进行深拷贝之前,已经释放了之前的资源,从而避…

Qt学习:图形视图框架的使用

文章目录 前言一、场景、视图和图形项的介绍二、图形视图框架的坐标系统三、图形视图框架的事件处理四、示例完整代码五、QtCreator官方示例总结 前言 近期重温了一下Qt中的图形视图框架,这里将所学习的内容进行记录总结。这个框架提供了一个基于图形项的模型视图编…

Java配置47-Spring Eureka 未授权访问漏洞修复

文章目录 1. 背景2. 方法2.1 Eureka Server 添加安全组件2.2 Eureka Server 添加参数2.3 重启 Eureka Server2.4 Eureka Server 升级版本2.5 Eureka Client 配置2.6 Eureka Server 添加代码2.7 其他问题 1. 背景 项目组使用的 Spring Boot 比较老,是 1.5.4.RELEASE…

Linux生成静态库

GCC 什么是GCC GCC 是 GNU 编译器集合(GNU Compiler Collection)的缩写。它是一个开源的编程语言编译器,支持多种编程语言,包括 C、C、Objective-C、Fortran、Ada 和 Go 等。GCC 最初由理查德斯托曼(Richard Stallman…

2022最新版-李宏毅机器学习深度学习课程-P32 Transformer

一、 seq2seq 1. 含义 输入一个序列,机器输出另一个序列,输出序列长度由机器决定。 文本翻译:文本至文本;  语音识别:语音至文本;  语音合成:文本至语音;  聊天机器人&#…

WPF布局控件之DockPanel布局

前言:博主文章仅用于学习、研究和交流目的,不足和错误之处在所难免,希望大家能够批评指出,博主核实后马上更改。 概述: DockPanel 位置子控件基于子 Dock 属性,你有 4 个选项停靠,左 (默认) &…

HarmonyOS 数据管理与应用数据持久化(二)

通过键值型数据库实现数据持久化 场景介绍 键值型数据库存储键值对形式的数据,当需要存储的数据没有复杂的关系模型,比如存储商品名称及对应价格、员工工号及今日是否已出勤等,由于数据复杂度低,更容易兼容不同数据库版本和设备…

Gradle笔记 一 Gradle的安装与入门

文章目录 Gradle 入门Gradle 简介学习Gradle 的原因: 常见的项目构建工具Gradle 安装Gradle 安装说明安装JDK 下载并解压到指定目录配置环境变量检测是否安装成功 Gradle 项目目录结构Gradle 创建第一个项目Gradle 中的常用指令修改maven 下载源Wrapper 包装器使用教…

项目管理之如何估算项目工作成本

在项目管理中,如何估算项目工作成本是一个关键问题。为了解决这个问题,我们可以采用自上而下的成本限额估算法和自下而上的成本汇总估算法。这两种方法各有优缺点,但都可以帮助我们准确地估算项目工作成本。 自上而下的成本限额估算法 自上…

InnoDB中Buffer Pool详解

1. 概念及特点 Buffer Pool 是 MySQL 中 InnoDB 存储引擎用来缓存表数据和索引数据的内存区域。这个内存区域被用来存储磁盘上的数据页的副本,这样常用的数据可以在内存中快速被访问,而不必每次都从磁盘中读取。 以下是 Buffer Pool 的一些重要特点&a…

学习c++的第十二天

目录 多态性 多态性 虚函数 虚析构函数 纯虚函数 多态性 多态性 多态性的实现依赖于继承和虚函数。在面向对象编程中,通过基类的指针或引用来调用派生类的成员函数时,可以根据实际的对象类型决定调用哪个类的成员函数,从而实现多态性。…

串口通信(6)应用定时器中断+串口中断实现接收一串数据

本文为博主 日月同辉,与我共生,csdn原创首发。希望看完后能对你有所帮助,不足之处请指正!一起交流学习,共同进步! > 发布人:日月同辉,与我共生_单片机-CSDN博客 > 欢迎你为独创博主日月同…

I/O多路转接之select

承接上文:I/O模型之非阻塞IO-CSDN博客 简介 select函数原型介绍使用 一个select简单的服务器的代码书写 select的缺点 初识select 系统提供select函数来实现多路复用输入/输出模型 select系统调用是用来让我们的程序监视多个文件描述符的状态变化的; 程序会停在s…

springboot+Redis+AOP实现请求限流器

写在开头 本文参考技术帖 程序员那点事 主要对学习经验进行总结,也会加上自己的理解注释。 配置RedisTemplate实例 //配置redis 使用String数据结构 //对key value 进行序列化 //根据配置连接redis Configuration public class RedisLimiterHelper {Beanpublic …

unittest 通过TextTestRunner(failfast=True),失败或错误时停止执行case

failfast是unittest.TextTestRunner的一个参数,它用于控制测试运行过程中遇到第一个失败或错误的测试方法后是否立即停止执行。 当failfast设置为True时,一旦发现第一个失败或错误的测试方法,测试运行就会立即停止,并输出相应的失…

Java多版本环境共存配置

文章目录 1. jenv是什么?2. 安装3. 配置4.多版本切换5. 总结 现在已经基本过了那句“他发由他发,我用Java8”的时代了,越来越多的开发者开始拥抱Java11,Java17(毕竟spring boot 3要求最低这个版本了)&#…

如何保证缓存中都是热点数据?

确保缓存中保留热点数据是关键,因为热点数据通常是最常被访问的数据,提高了缓存的命中率和整体性能。以下是一些策略和方法,能够帮助你维护缓存中的热点数据: 缓存策略: 缓存预热: 在系统启动时或负载较低的…