vue3项目使用Electron打包成exe的方法与打包报错解决

将vue3项目打包成exe文件方法

一、安装

1.安装electron

npm install electron --save-devnpm install electron-builder --save-dev

2.在vue项目根目录新建文件index.js

// index.js// Modules to control application life and create native browser window
const { app, BrowserWindow } = require('electron')const createWindow = () => {// Create the browser window.const mainWindow = new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true}})// and load the index.html of the app.mainWindow.loadFile('./dist/index.html')// Open the DevTools.// mainWindow.webContents.openDevTools()
}// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(() => {createWindow()app.on('activate', () => {// On macOS it's common to re-create a window in the app when the// dock icon is clicked and there are no other windows open.if (BrowserWindow.getAllWindows().length === 0) createWindow()})
})// Quit when all windows are closed, except on macOS. There, it's common
// for applications and their menu bar to stay active until the user quits
// explicitly with Cmd + Q.
app.on('window-all-closed', () => {if (process.platform !== 'darwin') app.quit()
})// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and require them here.

3.package.json文件编辑

"scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build","lint": "vue-cli-service lint","electron:build": "vue-cli-service build && electron-builder","electron:serve": "electron ."},"build": {"productName": "这里是你的项目名","appId": "com.example.这里是appId","win": {"icon": "favicon.ico","target": ["nsis", "appx"]},"directories": {"output": "build"},"files": ["dist/**/*","index.js"//这里是刚才建的index.js]},

4.测试
 

npm run electron:serve

5.打包

npm run electron:build

二、报错解决

 解决:打开cmd 执行 npm config edit

npm config edit

 打开配置文件 粘贴以下内容

registry=https://registry.npm.taobao.org/
sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
phantomjs_cdnurl=http://npm.taobao.org/mirrors/phantomjs
electron_mirror=https://npm.taobao.org/mirrors/electron/
ELECTRON_MIRROR=http://npm.taobao.org/mirrors/electron/

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

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

相关文章

Map-JAVA面试常问

1.HashMap底层实现 底层实现在jdk1.7和jdk1.8是不一样的 jdk1.7采用数组加链表的方式实现 jdk1.8采用数组加链表或者红黑树实现 HashMap中每个元素称之为一个哈希桶(bucket),哈希桶包含的内容有以下4项 hash值(哈希函数计算出来的值) Key value next(…

基于SSM+Jsp的水果销售管理网站

开发语言:Java框架:ssm技术:JSPJDK版本:JDK1.8服务器:tomcat7数据库:mysql 5.7(一定要5.7版本)数据库工具:Navicat11开发软件:eclipse/myeclipse/ideaMaven包…

Linux 五种IO模型

注:还有一种信号驱动IO,使用较少暂不讨论; 一,区分阻塞、非阻塞和同步、异步 看了很多文章对这两组概念解释和对比,说的太复杂了,其实没必要,两句话就能说清楚。 首先,对于读数据rec…

探索监管沙箱在金融科技行业中的应用

一、引言 随着金融科技的快速发展,传统金融机构与科技企业之间的竞争也日趋激烈。为了平衡金融科技创新与风险防控,各国监管机构纷纷引入监管沙箱(Regulatory Sandbox)机制。监管沙箱作为一个受监督的安全测试区,允许金…

在超线程CPU上切换到另一个线程

在超线程CPU上切换到另一个线程,主要涉及到的是上下文切换的过程。超线程技术允许单个CPU核心同时执行多个线程,提高了CPU的并行计算效率。当需要从一个线程切换到另一个线程时,CPU会进行一系列的操作来确保线程之间的顺利切换。 首先&#…

Linux字节对齐小程序

#include <stdio.h> // 默认对齐 struct DefaultAligned { char c; int i; }; // 按1字节对齐 #pragma pack(push, 1) struct OneByteAligned { char c; int i; }; #pragma pack(pop) // 恢复之前的对齐设置 int mai…

linux基础 - 内核的基础概念

目录 零. 前言 一. 源码简介 二. 存储管理 物理内存管理&#xff1a; 虚拟内存管理&#xff1a; 内存分配与回收&#xff1a; 三. CPU 和进程管理 进程管理&#xff1a; CPU 管理&#xff1a; 四. 文件系统 文件系统的概念 常见的 Linux 文件系统类型 文件系统的工…

Python日志管理利器:如何高效管理平台日志

一、为什么需要日志管理&#xff1f; 日志是应用程序的重要组成部分&#xff0c;它记录了应用程序的运行状态、错误信息以及用户交互等关键信息。良好的日志管理可以帮助开发人员及时发现和解决问题&#xff0c;提高应用程序的稳定性和可靠性。 项目在本地开发调试时&#xf…

Redis 有序集合(sorted set)

Redis 有序集合(sorted set) 引言 Redis&#xff0c;作为一个高性能的键值对数据库&#xff0c;提供了多种数据结构来满足不同的需求。其中&#xff0c;有序集合&#xff08;sorted set&#xff09;是一种特别的数据结构&#xff0c;它不仅具有集合&#xff08;set&#xff0…

CSS 计数器

CSS 计数器 CSS 计数器是 CSS 中一个强大但经常被忽视的功能。它们允许开发者创建和管理计数器,这些计数器可以在文档中自动递增,非常适合用于编号章节、列表项或其他文档元素。在本文中,我们将深入探讨 CSS 计数器的使用方法、优势和实际应用场景。 CSS 计数器的基本概念…

基于Sringboot+Vue的校园招聘系统【原创】【开源】

浏览器&#xff1a;Chrome或360浏览器 系统环境配置 前置条件&#xff1a;系统已经安装了Mysql5.7、Mysql工具&#xff08;Navicat&#xff09;、JDK1.8、Maven3.6.1、vue3.0以下开发环境、 Intellij Idea、 Chrome或360浏览器 1、导入数据库 2、编译前端代码vue 编译&…

C++笔记之通过CMakeLists.txt像使用boost库一样使用qt库中特有的模块来方便开发

C++笔记之通过CMakeLists.txt像使用boost库一样使用qt库中特有的模块来方便开发 code review! 文章目录 C++笔记之通过CMakeLists.txt像使用boost库一样使用qt库中特有的模块来方便开发1.文件结构2.CMakeLists.txt3.main.cpp4.运行1.文件结构 . ├── CMakeLists.txt └──…

设计模式--动态代理

动态代理是 Java 中一种常见的设计模式&#xff0c;它允许在运行时创建一个实现一组接口的代理类对象。Java 提供了 java.lang.reflect 包来支持动态代理的实现。在 JDK 中&#xff0c;可以使用 java.lang.reflect.Proxy 类和 java.lang.reflect.InvocationHandler 接口来创建动…

Hive怎么调整优化Tez引擎的查询?在Tez上优化Hive查询的指南

文章目录 在Tez上优化Hive查询的指南调优指南理解Tez中的并行化理解mapper数量理解reducer数量 并发案例1&#xff1a;未指定队列名称案例2&#xff1a;指定队列名称并发的指南/建议 容器复用和预热容器容器复用预热容器 一般Tez调优参数 在Tez上优化Hive查询的指南 在Tez上优…

golang中的corn

引包 "github.com/robfig/cron/v3"使用 taskCron : cron.New(cron.WithSeconds()) _, err : taskCron.AddFunc("* * * * * *", func() {doing.work})每一个*的含义 秒&#xff08;Seconds&#xff09; 是 0–59 * / , - 分&#xff08;Minutes&#xff…

HTML播放flv

页面效果&#xff1a; 代码如下&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"viewport" …

森林火灾扑救特类车辆有哪些_鼎跃安全

森林消防是在森林火灾发生时&#xff0c;为了保护森林资源&#xff0c;防止火势蔓延&#xff0c;采取了一系列的应用措施&#xff0c;针对自然环境中的火灾消防工作。森林灭火主要包括预警、预防措施、火情监测、火势控制和灭火等&#xff0c;森林火灾发生的地形往往复杂崎岖&a…

如何判断自己遇到的攻击是SQL注入攻击

要判断自己遇到的攻击是否是SQL注入攻击&#xff0c;可以从以下几个方面进行观察和分析&#xff1a; 攻击方式识别&#xff1a; 观察输入字段&#xff1a;如果攻击者在输入字段&#xff08;如用户名、密码框&#xff09;中输入了非正常的字符或语句&#xff0c;特别是与SQL语法…

【银河麒麟】高可用触发服务器异常重启,处理机制详解

1.服务器环境以及配置 【机型】物理机 处理器&#xff1a; Intel 内存&#xff1a; 126G 【内核版本】 4.19.90-25.16.v2101.ky10.x86_64 【银河麒麟操作系统镜像版本】 Kylin-Server-10-SP2-Release-Shenzhen-Metro-x86-Build01-20220619 Kylin-HA-10-SP2-Release-S…

NGINX_七 nginx 高级应用

七 nginx 高级应用 1 使用alias实现虚拟目录 location /test { # /var/www/qianfeng/index.htmlalias /var/www/qianfeng/;index index.html; }location /test { #/var/www/qianfeng/test/index.htmlroot /var/www/qianfeng/;index index.html; }2 通过 stub_status 模…