使用Electron将vue项目改桌面程序

news2024/12/27 15:09:19

1,一个简单的实现案例

# 切换镜像,其他镜像:https://registry.npm.taobao.org/
npm config set registry https://registry.npmmirror.com/ 
# 推荐使用yarn来管理依赖包,相对于Node.js自带的npm包管理工具来说,它具有速度更快、使用更简捷、操作更安全的特点
npm install -g yarn
# 安装Vue CLI
yarn global add @vue/cli
# 使用Vue CLI创建一个Vue项目,如果提示vue命令不存在,执行yarn global bin ,将输出的yarn路径添加到环境变量的path中
# 这里选择使用vue3
vue create chapter3_4
# 安装Vue插件electron-builder,过程中会提示你选择Electron的版本,选择最新版即可
vue add electron-builder
# 启动程序
yarn electron:serve

启动后的效果如图:
在这里插入图片描述

2,部分代码介绍

在这里插入图片描述

  • 在没有开发完全之前,这个桌面程序可以当作一般vue网页来开发,启动用yarn serve 来启动
  • 要关闭桌面端默认打开的调试窗口,直接注释掉background.js中的win.webContents.openDevTools()

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

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

相关文章

欧科云链OKLink相约TOKEN2049:更全面、多元与安全

过去几日,OKLink 与全球 Web3 从业者与爱好者们相约狮城。在多场激动人心的活动上分享了我们的产品进展、有关于链上数据的专家观点以及打磨产品的经验。同时也听到了很多来自行业的宝贵声音。跟随我们的脚步,捕捉这充实一周的精彩瞬间: 1、…

网络编程,tcp,守护进程化,前后台任务,bash与shell,会话

上篇,我们讲解了udp服务器与客户端的功能,这篇我们将使用tcp协议来进行编程;tcp服务器相比较与udp要更加稳定与安全,tcp服务器是面向连接的数据传输; 1. tcp服务器与客户端 下面是我实现的完整代码可以辅助下面的讲解…

we3.0里的钱包是什么?

we3.0里的钱包是什么? 在Web3.0的语境中,以太坊钱包是一种专为与以太坊区块链网络及其去中心化应用(DApps)交互而设计的数字钱包。这种钱包不仅支持用户存储、发送和接收以太币(ETH),还允许用户…

深入理解人工智能:从机器学习到深度学习

深入理解人工智能:从机器学习到深度学习 前言人工智能(AI)实际应用示例代码 机器学习(ML)分类常见算法示例代码 深度学习(DL)应用示例代码 神经网络(NN)研究方向示例代码…

使用canvas截取web camera指定区域,并生成图片

目标&#xff0c;截取红色色块背后的视频区域。 代码结构如下&#xff1a; <div id"p1"><video id"v1" autoplay playsinline></video><div id"mrz"></div><canvas id"captureCanvas"></can…

在 CentOS 安装 Python3.7 (没有弯路)

下载Python源码包 wget https://www.python.org/ftp/python/3.7.12/Python-3.7.12.tgz安装前准备 安装依赖组件 yum -y install wget zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel gcc make libffi-devel xz-devel解压安装 解…

前海石公园的停车点探寻

前海石公园是真的很美&#xff0c;很多看海人&#xff0c;很多钓鱼佬&#xff0c;很多抓螃蟹的人&#xff0c;很多挖沙子的人&#xff0c;很多拍照的人&#xff0c;尤其是没有大太阳的时间段或每天傍晚或每个放假的时候人气超高&#xff0c;故前海石公园停车真的很紧张。由于前…

INTO:Web3世界的“价值引力场”

在Web3的宇宙中&#xff0c;一股强大的引力正在重塑整个数字世界的格局。这股引力&#xff0c;来自一个名为INTO的“超级连接器”。作为Web3社交领域的先锋&#xff0c;INTO正在用一种前所未有的方式重构整个产业链的价值体系。它不再满足于单一领域的创新&#xff0c;而是大胆…

MySQL之基础篇

数据库操作 1.查看当前的数据库版本 select version(); 2.显示所有数据库 show databases; 3.创建数据库 create [if not exists] database 数据库名 character set 字符编码集 collate 排序规则&#xff1b; 我们这里提前说一下 被方括号括起来的代码 表示可写可不写 示例…

1panel申请https/ssl证书自动续期

参考教程 https://hin.cool/posts/sslfor1panel.html #Acme 账户 #1panel.腾讯云dns账号 这里有一步不需要参考,腾讯云dns账号,就是子帐号授权 直接控制台搜索 访问管理 创建用户 授权搜索dns,选择第一个 点击用户名,去掉AdministratorAccess权限 5.点击api密钥生成即可…

python绘制多个wav文件的基频曲线图

任务描述 需要在一个图中绘制多个wav文件的基频图&#xff0c;具体一点&#xff0c;绘制三种不正常的基频曲线&#xff0c;和一种正常的基频曲线进行对比&#xff0c;并且将正常的基频曲线的范围画出。 代码 import pyworld as pw import librosa import numpy as npdef extr…

微调大模型(Finetuning Large Language Models)—Data_preparation(四)

1. 数据的质量 数据准备的步骤&#xff1a; 什么是tokenizing&#xff1f; 其实就是将文本数据转换为代表文本的数字&#xff0c;一般是基于字符出现的频率。需要注意的&#xff0c;编码和解码的tokenizer需保持一致&#xff0c;一般训练的模型有自己专属匹配的tokenizer。 …

实习结帖(flask加上AIGC实现设计符合OpenAPI要求的OpenAPI Schema,让AIGC运行时可以调用api,协助公司门后迁移新后端等)

终于&#xff0c;笔者的实习生活也要告一段落了&#xff0c;最后的几天都在忙着和公司做AIGC的项目&#xff0c;在搞api的设计以及公司门户网站的迁移。 牛马搬运工&#xff08;牛马了3天&#xff09; 先说这个门户网站的迁移&#xff0c;我原本以为只是换个后端&#xff08;若…

新版本Android Studio如何新建Java code工程

新版本Android Studio主推Kotlin&#xff0c;很多同学以为无法新建Java工程了&#xff0c;其实是可以的&#xff0c;如果要新建Java代码的Android工程&#xff0c;在New Project的时候需要选择Empty Views Activity&#xff0c;如图所示&#xff0c;gradle也建议选为build.grad…

RP2040 C SDK GPIO和IRQ 唤醒功能使用

RP2040 C SDK GPIO和中断功能使用 SIO介绍 手册27页&#xff1a; The Single-cycle IO block (SIO) contains several peripherals that require low-latency, deterministic access from the processors. It is accessed via each processor’s IOPORT: this is an auxiliary…

MyBatis——Plus

MyBatis——Plus怎么知道他是访问哪张表

48 旋转图像

解题思路&#xff1a; \qquad 这道题同样需要用模拟解决&#xff0c;原地算法要求空间复杂度尽量小&#xff0c;最好为 O ( 1 ) O(1) O(1)。模拟的关键是找到旋转的内在规律&#xff0c;即旋转前后的位置坐标的变化规律。 \qquad 正方形矩阵类似洋葱&#xff0c;可以由不同大小…

计算机毕业设计 在线问诊系统的设计与实现 Java实战项目 附源码+文档+视频讲解

博主介绍&#xff1a;✌从事软件开发10年之余&#xff0c;专注于Java技术领域、Python人工智能及数据挖掘、小程序项目开发和Android项目开发等。CSDN、掘金、华为云、InfoQ、阿里云等平台优质作者✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精…

又一条地铁无人线开通!霞智科技智能清洁机器人正式“上岗”

2024年9月26日12时&#xff0c;又一条无人线开通运营&#xff0c;这是陕西省首条全自动无人驾驶地铁线路。该线路作为北跨战略的先行工程&#xff0c;是连接主城区与渭北地区的轨道交通快线&#xff0c;对优化城市总体空间布局、推动区域融合发展、促进沿线产业升级具有十分重要…

电脑上数据丢了怎么找回来 Win系统误删文件如何恢复

无论是在工作中&#xff0c;还是生活中&#xff0c;电脑都是不可缺少的重要工具&#xff0c;尤其是在工作中&#xff0c;电脑不仅可以高效的完成工作&#xff0c;还可以存储工作中的重要资料。不过在使用电脑的时候&#xff0c;也会遇到数据丢失的情况。针对这一问题&#xff0…