Electron案例解析-编写一个简单的electron程序

目录结构
index.html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><!-- 内容安全策略--><metahttp-equiv="Content-Security-Policy"content="default-src 'self'; script-src 'self'"/><metahttp-equiv="X-Content-Security-Policy"content="default-src 'self'; script-src 'self'"/><title>你好,Electron!</title>
</head>
<body>
<h1>你好,Electron!</h1>
<p>👋</p>
<p id="info"></p>
</body>
<script src="./renderer.js"></script>
</html>

main.js

//引入electron模块 app, BrowserWindow
const {app, BrowserWindow} = require('electron/main')//创建窗口
const createWindow = () => {const win = new BrowserWindow({//设置窗口大小 宽度800 高度600width: 800,height: 600})
//加载index.htmlwin.loadFile('index.html')
}//当Electron完成初始化并且准备创建窗口时调用createWindow()
app.whenReady().then(() => {//在应用准备就绪时调用函数createWindow()//如果没有窗口打开则打开一个窗口 (macOS) 这是兼容性处理必须的app.on('activate', () => {if (BrowserWindow.getAllWindows().length === 0) {createWindow()}})
})//关闭所有窗口时退出应用 (Windows & Linux) 这是兼容性处理必须的
app.on('window-all-closed', () => {if (process.platform !== 'darwin') app.quit()
})

renderer.js

//这个文件是渲染进程的入口文件,负责渲染页面的显示。
console.log("renderer.js loaded")

看效果,命令行运行

npm start

效果图

在这里插入图片描述

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

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

相关文章

C语言-栈和队列

文章目录 &#x1f3af;引言&#x1f453;栈和队列1.栈1.1栈的概念与结构1.2栈的实现 2.队列2.1队列的概念与结构2.2队列的实现 &#x1f947;结语 &#x1f3af;引言 欢迎来到HanLop博客的C语言数据结构初阶系列。在之前的文章中&#xff0c;我们详细介绍了链表及其操作方法。…

8年前端总结和感想(转)~

我是牛奶&#xff0c;本文是我前端工作 8 年的一些总结和感想 主要记录下个人点滴、前端知识点、场景应用、未来的憧憬以及个人规划&#xff0c;供自己以后查漏补缺&#xff0c;也欢迎同道朋友交流学习。 自我介绍 我是一名工作在非知名公司的 8 年前端&#xff0c;双非普通本…

AI发展下的伦理挑战:确保AI算法的公正性和透明度

AI算法的发展和应用正在改变我们的生活和社会&#xff0c;但同时也 raise 了许多伦理挑战。AI算法的公正性和透明度是其中一个关键的挑战。AI算法的可解释性和公开性是确保AI决策的透明度的关键要素。 AI算法的可解释性 AI算法的可解释性是指AI算法能够解释自己的决策和结果。…

JMeter使用手册

安装 下载地址 https://jmeter.apache.org/download_jmeter.cgi 下载后解压到win的文件夹中 打开JMeter的bin文件夹&#xff0c;双击这个jar就启动了JMeter 启动 出现这样的界面 基本使用 添加变量 这个变量在使用的时候可以被引用 创建线程组 所有的请求都得基于…

Linux:Linux进程概念

目录 前言 1. 冯诺依曼体系结构 2. 操作系统 2.1 什么是操作系统 3. 进程 3.1 基本概念 3.2 描述进程——PCB 3.3 进程和程序的区别 3.4 task_struct-PCB的一种 3.5 task_struct的内容分类 4. 查看进程 4.1 通过系统文件查看进程 4.2 通过ps指令查看进程 4.3 …

模型瘦身术:目标检测中的剪枝与量化

模型瘦身术&#xff1a;目标检测中的剪枝与量化 在深度学习领域&#xff0c;模型剪枝&#xff08;Pruning&#xff09;和量化&#xff08;Quantization&#xff09;是两种重要的模型优化技术。它们被广泛应用于目标检测任务中&#xff0c;以减少模型的大小、降低计算复杂度&am…

lse:一款专为渗透测试和CTF设计的Linux枚举工具

关于linux-smart-enumeration linux-smart-enumeration是一款专为渗透测试和CTF设计的Linux枚举工具&#xff0c;该工具可以帮助广大研究人员收集与本地Linux系统安全相关的信息。 工具特性 该工具从2.0版本开始符合POSIX标准&#xff0c;并且经过了shellcheck和posh测试。它…

【过滤器】过滤器作用以及如何实现全局过滤器

【背景】如果是大项目的话&#xff0c;使用全局过滤器再好不过啦&#xff01; 【用法】多个字段用一个方法格式化&#xff0c;如果这些字段想要格式化或者进行数据处理&#xff0c;就可以想到用过滤器去实现。同样如果在三目运算符中使用也有不同的语法使用。 【注意】过滤的是…

前端三大主流框架Vue React Angular有何不同?

前端主流框架&#xff0c;Vue React Angular&#xff0c;大家可能都经常在使用&#xff0c;Vue React&#xff0c;国内用的较多&#xff0c;Angualr相对用的少一点。但是大家有思考过这三大框架的不同吗&#xff1f; 一、项目的选型上 中小型项目&#xff1a;Vue2、React居多…

【数据结构-前缀和】力扣2550.统计范围内的元音字符串数

给你一个下标从 0 开始的字符串数组 words 以及一个二维整数数组 queries 。 每个查询 queries[i] [li, ri] 会要求我们统计在 words 中下标在 li 到 ri 范围内&#xff08;包含 这两个值&#xff09;并且以元音开头和结尾的字符串的数目。 返回一个整数数组&#xff0c;其中…

中文诗歌生成

用transformer在诗歌集上训练出的模型 import os os.environ["KERAS_BACKEND"] "tensorflow" # param ["tensorflow", "jax", "torch"] os.environ[TF_CPP_MIN_LOG_LEVEL] 2 os.environ[HF_ENDPOINT] https://hf-mirro…

IT程序员的黄金机遇

在这个数字化时代&#xff0c;IT程序员不仅是技术革新的推动者&#xff0c;更是全球经济的重要支柱。而对于拥有一技之长的IT人才来说&#xff0c;加拿大正敞开大门&#xff0c;提供一片充满机遇的热土。本文将为你揭示为何加拿大是IT程序员移民的不二之选&#xff0c;并提供实…

SecureCRT (mac or windows)解决中文显示乱码

中文乱码问题的方法主要包括设置SecureCRT的编码为UTF-8以及设置LANG环境变量为zh_CN.UTF-8。‌ 1.设置SecureCRT的编码为UTF-8&#xff1a;‌ 打开SecureCRT&#xff0c;‌进入Options -> Global Options -> Default Session -> Edit Default Settings-> Appear…

深入理解设计模式:六大经典模式解析

深入理解设计模式&#xff1a;六大经典模式解析 1. 单例模式&#xff08;Singleton Pattern&#xff09;1.1 概述1.2 示例场景1.3 实现要点 2. 工厂模式&#xff08;Factory Pattern&#xff09;2.1 简单工厂2.2 抽象工厂2.3 示例场景2.4 实现要点 3. 观察者模式&#xff08;Ob…

Idea配置远程开发

Idea配置远程开发 本篇博客介绍使用idea通过ssh连接ubuntu服务器进行开发 目录 Idea配置远程开发1.idae上点击file->Remote Development2.点击New Connection3.填写相关信息4.输入密码5.选择IDE版本和项目路径5.1 点击open an SSH terminal打开控制台5.2 依次执行命令 6.成…

竖版html网页简易抽奖系统

<!DOCTYPE html> <html> <head> <meta charset"utf-8"> <title>在线抽奖 随机选取 自动挑选</title> <meta name"viewport" content"widthdevice-width, initial-scale1.0"> <script src"htt…

初阶数据结构的实现1 顺序表和链表

顺序表和链表 1.线性表1.1顺序表1.1.1静态顺序表&#xff08;不去实现&#xff09;1.1.2动态顺序表1.1.2.1 定义程序目标1.1.2.2 设计程序1.1.2.3编写代码1.1.2.3测试和调试代码 1.1.2 顺序表的问题与思考 1.2链表1.2.1链表的概念及结构1.2.1.1 定义程序目标1.2.1.2 设计程序1.…

【C++新特性——对模板优化】

1模板右尖括号优化&#xff1a;在C11以前会看成右移运算符 #include<iostream> #include<map> using namespace std;template<typename T> class base { public:void print(T& it){auto i it.begin();for (; i ! it.end(); i)cout << i->firs…

人工智能算法工程师(高级)课程4-图像生成项目之自编码生成模型与代码详解

大家好&#xff0c;我是微学AI&#xff0c;今天给大家介绍一下人工智能算法工程师(高级)课程4-图像生成项目之自编码生成模型与代码详解。自编码生成模型&#xff08;Autoencoder&#xff09;是一种无监督学习算法&#xff0c;旨在通过编码器和解码器学习数据的有效表示。本文将…

聊聊Hugging Face

概述 HuggingFace是一个开源社区&#xff0c;提供了开源的AI研发框架、工具集、可在线加载的数据集仓库和预训练模型仓库。HuggingFace提出了一套可以依照的标准研发流程&#xff0c;按照该框架实施工程&#xff0c;能够在一定程度上规避开发混乱、开发人员水平不一致的问题&a…