vue + electron

node 版本 v14.19.3
npm 版本 6.14.17
要是node-sass报错执行命令:

npm uninstall node-sass sass-loader
npm i node-sass@4.14.1 sass-loader@7.3.1 --save -dev

首先安装依赖

npm install electron
npm install electron-packager

electronRun.js放在根目录下

const { app, BrowserWindow } = require('electron')function createWindow() {// Create the browser window.const mainWindow = new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true}})mainWindow.loadURL('http://172.26.96.37:8011')//mainWindow.loadFile('dist/index.html')
}app.whenReady().then(() => {createWindow()app.on('activate', function() {if (BrowserWindow.getAllWindows().length === 0) createWindow()})
})app.on('window-all-closed', function() {if (process.platform !== 'darwin') app.quit()
})

根目录的vue.config.js
路由用mode:‘hash’

export default new Router({mode: 'hash', // https://router.vuejs.org/api/#modelinkActiveClass: 'open active',

把publicPath:‘./’,

package.json文件里面加package和main

{"name": "@coreui/coreui-free-vue-admin-template","version": "2.1.5","description": "Open Source Bootstrap Admin Template","author": "Łukasz Holeczek","main": "electronRun.js","homepage": "http://coreui.io","copyright": "Copyright 2018 creativeLabs Łukasz Holeczek","license": "MIT","repository": {"type": "git","url": "git@github.com:coreui/coreui-free-vue-admin-template.git"},"scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build","lint": "vue-cli-service lint","test:unit": "vue-cli-service test:unit","test:e2e": "vue-cli-service test:e2e","package": "electron-packager ./ package --platform=win32 --arch=x64 --out=./out --app-version=0.0.1 --overwrite --ignore=node_modules"},

打包程序npm run build 生成dist文件
然后在执行npm run package
看见项目有out文件夹,里面有个exe,执行(项目要运行起来,在执行exe)

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

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

相关文章

华硕笔记本摄像头倒置怎么办?华硕笔记本摄像头上下颠倒怎么调整

笔记本电脑相较于台式电脑,更易携带,解决了很大一部分人的使用需求。但是笔记本电脑也存在很多不足,比如华硕笔记本电脑就经常会出现摄像头倒置的错误,出现这种问题要如何修复呢?下面就来看看详细的调整方法。 华硕笔记…

第十八掌、【Linux】认识与分析登录文件

18.1 什么是登录文件 什么是登录文件?简单地说,就是记录系统活动信息的几个文件,例如:何时何地何人,做了什么工作。换句话说就是:记录系统在什么时候由哪个程序做了什么样的行为时,发生了什么事…

centos安装Nginx配置Nginx

1. 查看操作系统有没有安装Nginx which nginx 2. 使用epel的方式进行安装(方法二) 先安装epel sudo yum install yum-utils 安装完成后,查看安装的epel包即可 sudo yum install epel 3 开始安装nginx 上面的两个方法不管选择哪个&…

万能近似定理(Universal Approximation Theorem)

万能近似定理(Universal Approximation Theorem)是指一个神经网络可以以任意精度来近似任何连续函数。这个定理最早由George Cybenko于1989年首次提出,并且后来由Kurt Hornik在1991年进行了进一步的证明。 具体来说,万能近似定理表…

MySQL官网下载安装包

MySQL官网: MySQL MySQL 8.0官网下载地址: MySQL :: Download MySQL Community Server 2023-07-18 MySQL 8.1.0 发布,这是 MySQL 变更发版模型后的第一个创新版本 (Innovation Release) 。 如果在官网中找不到下载位置,点击第二个…

JS获取Beego渲染模板Temple时传递的数据

如果纯粹的JS调用接口,获取后端数据很直接坦率,JSON解析也就可以了。 如果需要JS获取HTML页面加载时,后端传回来的一些数据,我们也可以通过以下的方式进行获取。范例如下: //通过person_name字段传递参数到html页面中…

vue axios实现下载文件及responseType:blob注意事项

需要使用axios和js-file-download组件 npm install js-file-download --save npm install axios --save import fileDownload from fileDownload; // 引入fileDownload import axios from axios; // 引入axios axios({method: get,url: xxxxxxx,responseType: blob }).then(r…

算法面试-深度学习面试题整理(2024.8.29开始,每天下午持续更新....)

一、无监督相关(聚类、异常检测) 1、常见的距离度量方法有哪些?写一下距离计算公式。 1)连续数据的距离计算: 闵可夫斯基距离家族: 当p 1时,为曼哈顿距离;p 2时,为欧…

新建Spring Boot项目

使用IDEA 来创建: 文件-新建-项目 填写项目元数据 选择依赖项 此处可以先选 web-spring web 关于这些依赖项,更多可参考: IDEA创建Spring boot项目时各依赖的说明(Developer Tools篇)[1] 项目结构介绍 展开项目,此时…

栈和队列(详解)

一、栈 1.1、栈的基本概念 1.1.1、栈的定义 栈(Stack):是只允许在一端进行插入或删除的线性表。首先栈是一种线性表,但限定这种线性表只能在某一端进行插入和删除操作。 栈顶(Top):线性表允许…

Tensorflow调用训练好的yolov5模型进行推理

文章目录 1、安装TensorFlow-GPU版本1.2、验证是否安装正常 2、将训练好的pt文件转换成onnx文件2.2、什么是Onnx模型和Tensorflow模型2.1、将onnx文件转换成pb文件 1、安装TensorFlow-GPU版本 1、创建虚拟环境python3.8 conda create -n TF2.4 python3.82、进入虚拟环境 conda…

使用WebSocket实现聊天功能

提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言一、数据库设计二、实现代码1.SessionWrap2.websocket3.insertMessage4.清除未读 前言 使用WebSocket实现一对一的聊天功能与未读消息功能 一、数据库设计 会话…

Oracle 本地客户端连接远程 Oracle 服务端并使用 c# 连接测试

这里写自定义目录标题 前言Oracle 客户端安装先决条件下载 Oracle 客户端Oracle 客户端环境变量配置 PL/SQLPL/SQL 下载PL/SQL 配置 配置远程连接tnsnames.ora 文件配置 使用 PL/SQL 连接远程数据库使用 C# 远程访问 Oracle 数据库结语 前言 最近有一个需要使用本地的 Oracle …

即时通讯开发中的性能优化技巧

即时通讯开发在如今的数字化社会中扮演着重要角色,然而,随着用户对即时通讯应用的需求不断增长,开发者们面临着使其应用保持高性能和可靠性的挑战。本文将探讨即时通讯开发中关键的性能优化技巧,帮助开发者们提升应用的用户体验和…

C语言:指针类型的意义

1.指针的类型决定了解引用时访问几个字节 2.指针的类型决定了指针1、-1跳过几个字节 一、指针的类型决定指针解引用时访问几个字节 例如 int 型指针解引用时访问4个字节 char 型指针解引用时访问1个字节 详解代码如下: int b 0x11223344(十六进制&…

CSS 滚动容器与固定 Tabbar 自适应的几种方式

问题 容器高度使用 px 定高时,随着页面高度发生变化,组件展示的数量不能最大化的铺满,导致出现底部留白。容器高度使用 vw 定高时,随着页面宽度发生变化,组件展示的数量不能最大化的铺满,导致出现底部留白…

【操作系统】聊聊文件传输的零拷贝、PageCache、异步IO机制

在目前主流的系统中,其实大多数都是数据密集型系统,所以设计数据密集型应用一书非常经典,推荐一读。而大多数遇到的问题都是存储问题。CPU、内存 因为本身的读写速度比较快,所以磁盘就成为了一个性能瓶颈。 针对磁盘优化的技术层…

Harbor 私有仓库迁移

文章目录 一.私有仓库迁移的介绍1.为何要对Harbor 私有仓库的迁移2.Harbor 私有仓库的迁移特点3. Harbor 私有仓库的迁移注意要点 二.私有仓库迁移配置1.源Harbor配置(192.168.198.11)(1)接着以下操作查看容器状况及是否可以登录 …

C语言之数组题

目录 1.使用函数实现数组操作 2.冒泡排序 3.三子棋 4.【一维数组】交换数组 5.扫雷 6.概念辨析tips 我又来了,今天是数组题,本人还在补军训真的热!🆗 1.使用函数实现数组操作 2.冒泡排序 3.三子棋 4.【一维数组】交换数组 …

Windows10 系统安装教程

多虚不如少实。 一、 下载安装包 下载前景:网上下载的 windows10 系统一般都有捆绑软件,用户体验不爽,所以建议到 正规渠道下载 windows10 系统的不同版本。另外网上也有一些 windows10 系统的镜像文件 可以直接一键安装,…